@aiao/rxdb-model-angular 0.0.17

package/fesm2022/aiao-rxdb-model-angular.mjs

@@ -0,0 +1,4584 @@
+import { RxDB, getEntityMetadata, RelationKind } from '@aiao/rxdb';
+import { formatEntityFieldValue, parseEntityFieldValue, validateForm, TableClipboardManager, CellTooltipManager, updateTableRecords, changeCellValue, createTheme, getCSSVariables, completeTableEdit, createListTable, patchDragIconForReadonlyRows, collectReorderedIds, handleTableKeydown, ROW_SERIES_COL_OFFSET, setCellSwitchState, collectDeleteWrites, getDisplayNamePath, findNodeByValue, applyPopoverPosition, buildFieldTree, findOptionLabel, getDefaultOperatorRegistry, UUID_RE, getInputType, getDefaultValueForType, parseCommaSeparatedInput, createQueryBuilderService, buildEditableColumns, organizeFields, extractFieldsFromMetadata, actionsColumn, buildFormFields, parsePropertyColumnValue, buildDetailTabs, entityToFormData } from '@aiao/rxdb-model';
+export * from '@aiao/rxdb-model';
+import { DialogRef, Dialog, DIALOG_DATA } from '@angular/cdk/dialog';
+import * as i0 from '@angular/core';
+import { inject, ElementRef, input, output, signal, ChangeDetectionStrategy, Component, linkedSignal, computed, InjectionToken, PLATFORM_ID, viewChild, afterNextRender, effect, untracked, Directive, viewChildren, Injector, ViewContainerRef, ViewChild, ErrorHandler, runInInjectionContext, HostListener, forwardRef } from '@angular/core';
+import { takeUntilDestroyed, toSignal, toObservable } from '@angular/core/rxjs-interop';
+import { switchMap, of } from 'rxjs';
+import * as i1 from '@angular/cdk/drag-drop';
+import { CdkDrag, CdkDragHandle } from '@angular/cdk/drag-drop';
+import * as i1$2 from '@angular/common';
+import { DOCUMENT, DatePipe, JsonPipe, isPlatformBrowser, CommonModule, NgComponentOutlet } from '@angular/common';
+import { InfiniteScrollingList } from '@aiao/rxdb-angular';
+import { CdkConnectedOverlay, CdkOverlayOrigin } from '@angular/cdk/overlay';
+import * as i2 from 'lucide-angular';
+import { ChevronDownIcon, ChevronRightIcon, TableIcon, ListChecksIcon, Link2Icon, BracesIcon, ListIcon, CalendarIcon, ToggleLeftIcon, HashIcon, TypeIcon, LucideAngularModule, Undo2, Redo2, Funnel } from 'lucide-angular';
+import { ActiveDescendantKeyManager } from '@angular/cdk/a11y';
+import * as i1$1 from '@angular/forms';
+import { FormsModule } from '@angular/forms';
+
+class EntityDialogComponent {
+    #dialogRef = inject(DialogRef, { optional: true });
+    #cdkDrag = inject(CdkDrag, { optional: true, self: true });
+    #el = inject(ElementRef);
+    #doc = inject(DOCUMENT);
+    #pane = null;
+    #resizing = false;
+    #savedPaneState = null;
+    title = input.required(...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
+    closeRequested = output();
+    isFullscreen = signal(false, ...(ngDevMode ? [{ debugName: "isFullscreen" }] : /* istanbul ignore next */ []));
+    isInDialog = !!inject(DialogRef, { optional: true });
+    constructor() {
+        if (this.#cdkDrag) {
+            if (this.isInDialog) {
+                this.#cdkDrag.rootElementSelector = '.cdk-overlay-pane';
+                this.#cdkDrag.boundaryElement = '.cdk-overlay-container';
+            }
+            else {
+                this.#cdkDrag.disabled = true;
+            }
+        }
+    }
+    ngAfterViewInit() {
+        if (!this.isInDialog)
+            return;
+        requestAnimationFrame(() => this.#initFixedPane());
+    }
+    close() {
+        this.closeRequested.emit();
+        this.#dialogRef?.close();
+    }
+    toggleFullscreen() {
+        const wasFullscreen = this.isFullscreen();
+        this.isFullscreen.set(!wasFullscreen);
+        const fullscreen = !wasFullscreen;
+        const pane = this.#pane;
+        if (!pane)
+            return;
+        if (fullscreen) {
+            this.#savedPaneState = {
+                left: pane.style.left,
+                top: pane.style.top,
+                width: pane.style.width,
+                height: pane.style.height
+            };
+            pane.style.left = '0';
+            pane.style.top = '0';
+            pane.style.width = '100vw';
+            pane.style.height = '100vh';
+            if (this.#cdkDrag) {
+                this.#cdkDrag.disabled = true;
+                this.#cdkDrag.setFreeDragPosition({ x: 0, y: 0 });
+            }
+        }
+        else {
+            if (this.#savedPaneState) {
+                pane.style.left = this.#savedPaneState.left;
+                pane.style.top = this.#savedPaneState.top;
+                pane.style.width = this.#savedPaneState.width;
+                pane.style.height = this.#savedPaneState.height;
+                this.#savedPaneState = null;
+            }
+            if (this.#cdkDrag)
+                this.#cdkDrag.disabled = false;
+        }
+    }
+    startResize(e, dir) {
+        const pane = this.#pane;
+        if (!pane || this.#resizing || this.isFullscreen())
+            return;
+        e.preventDefault();
+        e.stopPropagation();
+        this.#resizing = true;
+        const startX = e.clientX;
+        const startY = e.clientY;
+        const startW = pane.offsetWidth;
+        const startH = pane.offsetHeight;
+        const startL = parseFloat(pane.style.left) || 0;
+        const startT = parseFloat(pane.style.top) || 0;
+        const minW = 400;
+        const minH = 300;
+        const onMove = (ev) => {
+            const dx = ev.clientX - startX;
+            const dy = ev.clientY - startY;
+            if (dir.includes('e'))
+                pane.style.width = Math.max(minW, startW + dx) + 'px';
+            if (dir.includes('w')) {
+                const w = Math.max(minW, startW - dx);
+                pane.style.width = w + 'px';
+                pane.style.left = startL + startW - w + 'px';
+            }
+            if (dir.includes('s'))
+                pane.style.height = Math.max(minH, startH + dy) + 'px';
+            if (dir.includes('n')) {
+                const h = Math.max(minH, startH - dy);
+                pane.style.height = h + 'px';
+                pane.style.top = startT + startH - h + 'px';
+            }
+        };
+        const onUp = () => {
+            this.#resizing = false;
+            this.#doc.removeEventListener('mousemove', onMove);
+            this.#doc.removeEventListener('mouseup', onUp);
+        };
+        this.#doc.addEventListener('mousemove', onMove);
+        this.#doc.addEventListener('mouseup', onUp);
+    }
+    #initFixedPane() {
+        const pane = this.#el.nativeElement.closest('.cdk-overlay-pane');
+        if (!pane)
+            return;
+        this.#pane = pane;
+        const rect = pane.getBoundingClientRect();
+        if (this.#cdkDrag)
+            this.#cdkDrag.setFreeDragPosition({ x: 0, y: 0 });
+        pane.style.position = 'fixed';
+        pane.style.left = rect.left + 'px';
+        pane.style.top = rect.top + 'px';
+        pane.style.margin = '0';
+        pane.style.maxWidth = 'none';
+        pane.style.maxHeight = 'none';
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: EntityDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: EntityDialogComponent, isStandalone: true, selector: "rxdb-entity-dialog", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { closeRequested: "closeRequested" }, hostDirectives: [{ directive: i1.CdkDrag, inputs: ["cdkDragBoundary", "cdkDragBoundary"] }], ngImport: i0, template: "<!-- Resize handles -->\n@if (isInDialog) {\n  <div class=\"resize-handle resize-n\" (mousedown)=\"startResize($event, 'n')\"></div>\n  <div class=\"resize-handle resize-s\" (mousedown)=\"startResize($event, 's')\"></div>\n  <div class=\"resize-handle resize-e\" (mousedown)=\"startResize($event, 'e')\"></div>\n  <div class=\"resize-handle resize-w\" (mousedown)=\"startResize($event, 'w')\"></div>\n  <div class=\"resize-handle resize-ne\" (mousedown)=\"startResize($event, 'ne')\"></div>\n  <div class=\"resize-handle resize-nw\" (mousedown)=\"startResize($event, 'nw')\"></div>\n  <div class=\"resize-handle resize-se\" (mousedown)=\"startResize($event, 'se')\"></div>\n  <div class=\"resize-handle resize-sw\" (mousedown)=\"startResize($event, 'sw')\"></div>\n}\n\n<!-- Dialog Title Bar (drag handle + fullscreen toggle + close) -->\n@if (isInDialog) {\n  <div class=\"border-base-300 flex shrink-0 items-center justify-between border-b px-4 py-2\">\n    <span class=\"flex-1 cursor-grab text-base font-semibold select-none active:cursor-grabbing\" cdkDragHandle>\n      {{ title() }}\n    </span>\n    <div class=\"flex items-center gap-1\">\n      <!-- Fullscreen Toggle -->\n      <button\n        class=\"btn btn-ghost btn-xs btn-square\"\n        [attr.aria-label]=\"isFullscreen() ? '\u9000\u51FA\u5168\u5C4F' : '\u5168\u5C4F'\"\n        (click)=\"toggleFullscreen()\"\n        type=\"button\"\n      >\n        @if (isFullscreen()) {\n          <svg class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n            <path d=\"M8 3v3a2 2 0 0 1-2 2H3m18 0h-3a2 2 0 0 1-2-2V3m0 18v-3a2 2 0 0 1 2-2h3M3 16h3a2 2 0 0 1 2 2v3\" />\n          </svg>\n        } @else {\n          <svg class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n            <path d=\"M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7\" />\n          </svg>\n        }\n      </button>\n      <!-- Close -->\n      <button class=\"btn btn-ghost btn-xs btn-square\" (click)=\"close()\" aria-label=\"\u5173\u95ED\" type=\"button\">\n        <svg class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n          <path d=\"M18 6 6 18M6 6l12 12\" />\n        </svg>\n      </button>\n    </div>\n  </div>\n}\n\n<!-- Projected content -->\n<ng-content />\n", styles: [":host{display:flex;flex-direction:column;height:100%;overflow:hidden;background-color:var(--color-base-100);border-radius:var(--radius-md)}.resize-handle{position:absolute;z-index:100}.resize-n{top:-4px;left:8px;right:8px;height:8px;cursor:n-resize}.resize-s{bottom:-4px;left:8px;right:8px;height:8px;cursor:s-resize}.resize-e{top:8px;bottom:8px;right:-4px;width:8px;cursor:e-resize}.resize-w{top:8px;bottom:8px;left:-4px;width:8px;cursor:w-resize}.resize-ne{top:-4px;right:-4px;width:16px;height:16px;cursor:ne-resize}.resize-nw{top:-4px;left:-4px;width:16px;height:16px;cursor:nw-resize}.resize-se{bottom:-4px;right:-4px;width:16px;height:16px;cursor:se-resize}.resize-sw{bottom:-4px;left:-4px;width:16px;height:16px;cursor:sw-resize}\n"], dependencies: [{ kind: "directive", type: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: EntityDialogComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rxdb-entity-dialog', imports: [CdkDragHandle], hostDirectives: [{ directive: CdkDrag, inputs: ['cdkDragBoundary'] }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Resize handles -->\n@if (isInDialog) {\n  <div class=\"resize-handle resize-n\" (mousedown)=\"startResize($event, 'n')\"></div>\n  <div class=\"resize-handle resize-s\" (mousedown)=\"startResize($event, 's')\"></div>\n  <div class=\"resize-handle resize-e\" (mousedown)=\"startResize($event, 'e')\"></div>\n  <div class=\"resize-handle resize-w\" (mousedown)=\"startResize($event, 'w')\"></div>\n  <div class=\"resize-handle resize-ne\" (mousedown)=\"startResize($event, 'ne')\"></div>\n  <div class=\"resize-handle resize-nw\" (mousedown)=\"startResize($event, 'nw')\"></div>\n  <div class=\"resize-handle resize-se\" (mousedown)=\"startResize($event, 'se')\"></div>\n  <div class=\"resize-handle resize-sw\" (mousedown)=\"startResize($event, 'sw')\"></div>\n}\n\n<!-- Dialog Title Bar (drag handle + fullscreen toggle + close) -->\n@if (isInDialog) {\n  <div class=\"border-base-300 flex shrink-0 items-center justify-between border-b px-4 py-2\">\n    <span class=\"flex-1 cursor-grab text-base font-semibold select-none active:cursor-grabbing\" cdkDragHandle>\n      {{ title() }}\n    </span>\n    <div class=\"flex items-center gap-1\">\n      <!-- Fullscreen Toggle -->\n      <button\n        class=\"btn btn-ghost btn-xs btn-square\"\n        [attr.aria-label]=\"isFullscreen() ? '\u9000\u51FA\u5168\u5C4F' : '\u5168\u5C4F'\"\n        (click)=\"toggleFullscreen()\"\n        type=\"button\"\n      >\n        @if (isFullscreen()) {\n          <svg class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n            <path d=\"M8 3v3a2 2 0 0 1-2 2H3m18 0h-3a2 2 0 0 1-2-2V3m0 18v-3a2 2 0 0 1 2-2h3M3 16h3a2 2 0 0 1 2 2v3\" />\n          </svg>\n        } @else {\n          <svg class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n            <path d=\"M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7\" />\n          </svg>\n        }\n      </button>\n      <!-- Close -->\n      <button class=\"btn btn-ghost btn-xs btn-square\" (click)=\"close()\" aria-label=\"\u5173\u95ED\" type=\"button\">\n        <svg class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n          <path d=\"M18 6 6 18M6 6l12 12\" />\n        </svg>\n      </button>\n    </div>\n  </div>\n}\n\n<!-- Projected content -->\n<ng-content />\n", styles: [":host{display:flex;flex-direction:column;height:100%;overflow:hidden;background-color:var(--color-base-100);border-radius:var(--radius-md)}.resize-handle{position:absolute;z-index:100}.resize-n{top:-4px;left:8px;right:8px;height:8px;cursor:n-resize}.resize-s{bottom:-4px;left:8px;right:8px;height:8px;cursor:s-resize}.resize-e{top:8px;bottom:8px;right:-4px;width:8px;cursor:e-resize}.resize-w{top:8px;bottom:8px;left:-4px;width:8px;cursor:w-resize}.resize-ne{top:-4px;right:-4px;width:16px;height:16px;cursor:ne-resize}.resize-nw{top:-4px;left:-4px;width:16px;height:16px;cursor:nw-resize}.resize-se{bottom:-4px;right:-4px;width:16px;height:16px;cursor:se-resize}.resize-sw{bottom:-4px;left:-4px;width:16px;height:16px;cursor:sw-resize}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], closeRequested: [{ type: i0.Output, args: ["closeRequested"] }] } });
+
+class EntityFormComponent {
+    fields = input.required(...(ngDevMode ? [{ debugName: "fields" }] : /* istanbul ignore next */ []));
+    data = input.required(...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
+    mode = input('view', ...(ngDevMode ? [{ debugName: "mode" }] : /* istanbul ignore next */ []));
+    relatedEntityProvider = input(...(ngDevMode ? [undefined, { debugName: "relatedEntityProvider" }] : /* istanbul ignore next */ []));
+    showActions = input(true, ...(ngDevMode ? [{ debugName: "showActions" }] : /* istanbul ignore next */ []));
+    fieldChanged = output();
+    formSubmitted = output();
+    formCancelled = output();
+    validationErrors = output();
+    formData = linkedSignal(() => ({ ...this.data() }), ...(ngDevMode ? [{ debugName: "formData" }] : /* istanbul ignore next */ []));
+    editableFields = computed(() => {
+        return this.fields().filter(f => !f.hidden);
+    }, ...(ngDevMode ? [{ debugName: "editableFields" }] : /* istanbul ignore next */ []));
+    isReadonly = computed(() => this.mode() === 'view', ...(ngDevMode ? [{ debugName: "isReadonly" }] : /* istanbul ignore next */ []));
+    relatedItemsMap = computed(() => {
+        const provider = this.relatedEntityProvider();
+        const fields = this.editableFields();
+        const map = new Map();
+        if (!provider)
+            return map;
+        for (const field of fields) {
+            if (field.relatedEntityName) {
+                map.set(field.field, provider(field.relatedEntityName, field.relatedNamespace));
+            }
+        }
+        return map;
+    }, ...(ngDevMode ? [{ debugName: "relatedItemsMap" }] : /* istanbul ignore next */ []));
+    displayValueMap = computed(() => {
+        const data = this.formData();
+        const fields = this.editableFields();
+        const itemsMap = this.relatedItemsMap();
+        const map = new Map();
+        for (const field of fields) {
+            if (!this.isReadonly() && field.readonly !== true)
+                continue;
+            const value = data[field.field];
+            if ((field.type === 'oneToOne' || field.type === 'manyToOne') && field.relatedEntityName) {
+                const items = itemsMap.get(field.field) ?? [];
+                const item = items.find(i => i.id === value);
+                map.set(field.field, item?.displayName ?? formatEntityFieldValue(field.type, value));
+            }
+            else {
+                map.set(field.field, formatEntityFieldValue(field.type, value));
+            }
+        }
+        return map;
+    }, ...(ngDevMode ? [{ debugName: "displayValueMap" }] : /* istanbul ignore next */ []));
+    onFieldChange(field, rawValue) {
+        const current = this.formData();
+        const previousValue = current[field.field];
+        const parsed = parseEntityFieldValue(field.type, rawValue);
+        this.formData.set({ ...current, [field.field]: parsed });
+        this.fieldChanged.emit({ field: field.field, type: field.type, value: parsed, previousValue });
+    }
+    onSubmit() {
+        const currentFields = this.fields();
+        const currentData = this.formData();
+        const result = validateForm(currentFields, currentData);
+        if (!result.valid) {
+            this.validationErrors.emit(result);
+            return;
+        }
+        this.formSubmitted.emit(currentData);
+    }
+    onCancel() {
+        this.formData.set({ ...this.data() });
+        this.formCancelled.emit();
+    }
+    isFieldReadonly(field) {
+        return this.isReadonly() || field.readonly === true;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: EntityFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: EntityFormComponent, isStandalone: true, selector: "rxdb-entity-form", inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, relatedEntityProvider: { classPropertyName: "relatedEntityProvider", publicName: "relatedEntityProvider", isSignal: true, isRequired: false, transformFunction: null }, showActions: { classPropertyName: "showActions", publicName: "showActions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fieldChanged: "fieldChanged", formSubmitted: "formSubmitted", formCancelled: "formCancelled", validationErrors: "validationErrors" }, ngImport: i0, template: `<form class="grid grid-cols-1 gap-4 md:grid-cols-2" (submit)="$event.preventDefault(); onSubmit()">
+    @for (field of editableFields(); track field.field) {
+      <fieldset
+        class="fieldset"
+        [class.md:col-span-2]="field.span === 2 || field.type === 'json' || field.type === 'keyValue'"
+      >
+        <legend class="fieldset-legend">{{ field.displayName }}</legend>
+        @if (isFieldReadonly(field)) {
+          <div class="input input-ghost flex min-h-10 items-center">{{ displayValueMap().get(field.field) ?? '' }}</div>
+        } @else {
+          @switch (field.type) {
+            @case ('boolean') {
+              <input
+                class="toggle"
+                [checked]="!!formData()[field.field]"
+                (change)="onFieldChange(field, $any($event.target).checked)"
+                type="checkbox"
+              />
+            }
+            @case ('enum') {
+              <select
+                class="select"
+                [value]="formData()[field.field] ?? ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+              >
+                @if (field.nullable) {
+                  <option value="">(空)</option>
+                }
+                @for (val of field.enumValues ?? []; track val) {
+                  <option [value]="val">{{ val }}</option>
+                }
+              </select>
+            }
+            @case ('date') {
+              <input
+                class="input"
+                [value]="formData()[field.field] ? ($any(formData()[field.field]) | date: 'yyyy-MM-ddTHH:mm') : ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+                type="datetime-local"
+              />
+            }
+            @case ('number') {
+              <input
+                class="input"
+                [attr.placeholder]="field.placeholder ?? ''"
+                [value]="formData()[field.field] ?? ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+                step="any"
+                type="number"
+              />
+            }
+            @case ('integer') {
+              <input
+                class="input"
+                [attr.placeholder]="field.placeholder ?? ''"
+                [value]="formData()[field.field] ?? ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+                step="1"
+                type="number"
+              />
+            }
+            @case ('stringArray') {
+              <input
+                class="input"
+                [attr.placeholder]="field.placeholder ?? '逗号分隔'"
+                [value]="$any(formData()[field.field] ?? []).join(', ')"
+                (change)="onFieldChange(field, $any($event.target).value)"
+                type="text"
+              />
+            }
+            @case ('numberArray') {
+              <input
+                class="input"
+                [attr.placeholder]="field.placeholder ?? '逗号分隔数字'"
+                [value]="$any(formData()[field.field] ?? []).join(', ')"
+                (change)="onFieldChange(field, $any($event.target).value)"
+                type="text"
+              />
+            }
+            @case ('json') {
+              <textarea
+                class="textarea min-h-24"
+                [attr.placeholder]="field.placeholder ?? 'JSON'"
+                [value]="formData()[field.field] !== null ? (formData()[field.field] | json) : ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+              ></textarea>
+            }
+            @case ('keyValue') {
+              <textarea
+                class="textarea min-h-24"
+                [attr.placeholder]="field.placeholder ?? 'JSON'"
+                [value]="formData()[field.field] !== null ? (formData()[field.field] | json) : ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+              ></textarea>
+            }
+            @case ('oneToOne') {
+              <select
+                class="select"
+                [value]="formData()[field.field] ?? ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+              >
+                <option value="">(空)</option>
+                @for (item of relatedItemsMap().get(field.field) ?? []; track item.id) {
+                  <option [value]="item.id">{{ item.displayName }}</option>
+                }
+              </select>
+            }
+            @case ('manyToOne') {
+              <select
+                class="select"
+                [value]="formData()[field.field] ?? ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+              >
+                <option value="">(空)</option>
+                @for (item of relatedItemsMap().get(field.field) ?? []; track item.id) {
+                  <option [value]="item.id">{{ item.displayName }}</option>
+                }
+              </select>
+            }
+            @default {
+              <input
+                class="input"
+                [attr.placeholder]="field.placeholder ?? ''"
+                [value]="formData()[field.field] ?? ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+                type="text"
+              />
+            }
+          }
+        }
+        @if (field.helpText) {
+          <p class="label">{{ field.helpText }}</p>
+        }
+      </fieldset>
+    }
+    @if (!isReadonly() && showActions()) {
+      <div class="flex justify-end gap-2 pt-2 md:col-span-2">
+        <button class="btn" (click)="onCancel()" type="button">取消</button>
+        <button class="btn btn-primary" type="submit">保存</button>
+      </div>
+    }
+  </form>`, isInline: true, dependencies: [{ kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: JsonPipe, name: "json" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: EntityFormComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'rxdb-entity-form',
+                    imports: [DatePipe, JsonPipe],
+                    template: `<form class="grid grid-cols-1 gap-4 md:grid-cols-2" (submit)="$event.preventDefault(); onSubmit()">
+    @for (field of editableFields(); track field.field) {
+      <fieldset
+        class="fieldset"
+        [class.md:col-span-2]="field.span === 2 || field.type === 'json' || field.type === 'keyValue'"
+      >
+        <legend class="fieldset-legend">{{ field.displayName }}</legend>
+        @if (isFieldReadonly(field)) {
+          <div class="input input-ghost flex min-h-10 items-center">{{ displayValueMap().get(field.field) ?? '' }}</div>
+        } @else {
+          @switch (field.type) {
+            @case ('boolean') {
+              <input
+                class="toggle"
+                [checked]="!!formData()[field.field]"
+                (change)="onFieldChange(field, $any($event.target).checked)"
+                type="checkbox"
+              />
+            }
+            @case ('enum') {
+              <select
+                class="select"
+                [value]="formData()[field.field] ?? ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+              >
+                @if (field.nullable) {
+                  <option value="">(空)</option>
+                }
+                @for (val of field.enumValues ?? []; track val) {
+                  <option [value]="val">{{ val }}</option>
+                }
+              </select>
+            }
+            @case ('date') {
+              <input
+                class="input"
+                [value]="formData()[field.field] ? ($any(formData()[field.field]) | date: 'yyyy-MM-ddTHH:mm') : ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+                type="datetime-local"
+              />
+            }
+            @case ('number') {
+              <input
+                class="input"
+                [attr.placeholder]="field.placeholder ?? ''"
+                [value]="formData()[field.field] ?? ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+                step="any"
+                type="number"
+              />
+            }
+            @case ('integer') {
+              <input
+                class="input"
+                [attr.placeholder]="field.placeholder ?? ''"
+                [value]="formData()[field.field] ?? ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+                step="1"
+                type="number"
+              />
+            }
+            @case ('stringArray') {
+              <input
+                class="input"
+                [attr.placeholder]="field.placeholder ?? '逗号分隔'"
+                [value]="$any(formData()[field.field] ?? []).join(', ')"
+                (change)="onFieldChange(field, $any($event.target).value)"
+                type="text"
+              />
+            }
+            @case ('numberArray') {
+              <input
+                class="input"
+                [attr.placeholder]="field.placeholder ?? '逗号分隔数字'"
+                [value]="$any(formData()[field.field] ?? []).join(', ')"
+                (change)="onFieldChange(field, $any($event.target).value)"
+                type="text"
+              />
+            }
+            @case ('json') {
+              <textarea
+                class="textarea min-h-24"
+                [attr.placeholder]="field.placeholder ?? 'JSON'"
+                [value]="formData()[field.field] !== null ? (formData()[field.field] | json) : ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+              ></textarea>
+            }
+            @case ('keyValue') {
+              <textarea
+                class="textarea min-h-24"
+                [attr.placeholder]="field.placeholder ?? 'JSON'"
+                [value]="formData()[field.field] !== null ? (formData()[field.field] | json) : ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+              ></textarea>
+            }
+            @case ('oneToOne') {
+              <select
+                class="select"
+                [value]="formData()[field.field] ?? ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+              >
+                <option value="">(空)</option>
+                @for (item of relatedItemsMap().get(field.field) ?? []; track item.id) {
+                  <option [value]="item.id">{{ item.displayName }}</option>
+                }
+              </select>
+            }
+            @case ('manyToOne') {
+              <select
+                class="select"
+                [value]="formData()[field.field] ?? ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+              >
+                <option value="">(空)</option>
+                @for (item of relatedItemsMap().get(field.field) ?? []; track item.id) {
+                  <option [value]="item.id">{{ item.displayName }}</option>
+                }
+              </select>
+            }
+            @default {
+              <input
+                class="input"
+                [attr.placeholder]="field.placeholder ?? ''"
+                [value]="formData()[field.field] ?? ''"
+                (change)="onFieldChange(field, $any($event.target).value)"
+                type="text"
+              />
+            }
+          }
+        }
+        @if (field.helpText) {
+          <p class="label">{{ field.helpText }}</p>
+        }
+      </fieldset>
+    }
+    @if (!isReadonly() && showActions()) {
+      <div class="flex justify-end gap-2 pt-2 md:col-span-2">
+        <button class="btn" (click)="onCancel()" type="button">取消</button>
+        <button class="btn btn-primary" type="submit">保存</button>
+      </div>
+    }
+  </form>`,
+                    changeDetection: ChangeDetectionStrategy.OnPush
+                }]
+        }], propDecorators: { fields: [{ type: i0.Input, args: [{ isSignal: true, alias: "fields", required: true }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], relatedEntityProvider: [{ type: i0.Input, args: [{ isSignal: true, alias: "relatedEntityProvider", required: false }] }], showActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "showActions", required: false }] }], fieldChanged: [{ type: i0.Output, args: ["fieldChanged"] }], formSubmitted: [{ type: i0.Output, args: ["formSubmitted"] }], formCancelled: [{ type: i0.Output, args: ["formCancelled"] }], validationErrors: [{ type: i0.Output, args: ["validationErrors"] }] } });
+
+const ENTITY_TABLE_CONFIG = new InjectionToken('ENTITY_TABLE_CONFIG');
+
+/**
+ * 通用实体数据表格组件
+ *
+ * 基于 VTable 提供高性能表格渲染，支持：
+ * - 单元格编辑（文本、开关、复选框、下拉）
+ * - 剪贴板操作（Ctrl+C/V，TSV 格式）
+ * - 拖拽排序
+ * - 键盘导航（Enter 切换开关，Delete 清空单元格）
+ * - 主题系统（daisyUI CSS 变量）
+ * - 校验错误 tooltip
+ */
+class EntityTableComponent {
+    #platformId = inject(PLATFORM_ID);
+    #config = inject(ENTITY_TABLE_CONFIG, { optional: true });
+    #tableInstance = null;
+    #destroyed = false;
+    #tableReady = signal(false, ...(ngDevMode ? [{ debugName: "#tableReady" }] : /* istanbul ignore next */ []));
+    #prevColumns = null;
+    #prevRecords = null;
+    #selectedCell = null;
+    #containerKeydownHandler = null;
+    #resizeObserver = null;
+    #cellTooltip = signal(null, ...(ngDevMode ? [{ debugName: "#cellTooltip" }] : /* istanbul ignore next */ []));
+    #headerHeight = signal(40, ...(ngDevMode ? [{ debugName: "#headerHeight" }] : /* istanbul ignore next */ []));
+    #clipboard = new TableClipboardManager();
+    #tooltip = new CellTooltipManager();
+    #container = null;
+    tableContainer = viewChild('tableContainer', ...(ngDevMode ? [{ debugName: "tableContainer" }] : /* istanbul ignore next */ []));
+    // ── 输入 ──────────────────────────────────────────────────────────
+    records = input.required(...(ngDevMode ? [{ debugName: "records" }] : /* istanbul ignore next */ []));
+    columns = input.required(...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
+    isDarkMode = input(false, ...(ngDevMode ? [{ debugName: "isDarkMode" }] : /* istanbul ignore next */ []));
+    idField = input('id', ...(ngDevMode ? [{ debugName: "idField" }] : /* istanbul ignore next */ []));
+    nonClearableFields = input(new Set(), ...(ngDevMode ? [{ debugName: "nonClearableFields" }] : /* istanbul ignore next */ []));
+    tableOptions = input(...(ngDevMode ? [undefined, { debugName: "tableOptions" }] : /* istanbul ignore next */ []));
+    cellErrorDetector = input(...(ngDevMode ? [undefined, { debugName: "cellErrorDetector" }] : /* istanbul ignore next */ []));
+    loading = input(false, ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
+    /** 业务层回调判断单元格是否可清空（返回 false 跳过），替代领域特定的硬编码逻辑 */
+    cellClearable = input(...(ngDevMode ? [undefined, { debugName: "cellClearable" }] : /* istanbul ignore next */ []));
+    /** 触底时加载更多数据的回调，由表格内部在滚动到底部时调用 */
+    loadMore = input(...(ngDevMode ? [undefined, { debugName: "loadMore" }] : /* istanbul ignore next */ []));
+    /** 加载更多中状态（已有数据，底部小 spinner，不拦截滚动） */
+    loadingMore = input(false, ...(ngDevMode ? [{ debugName: "loadingMore" }] : /* istanbul ignore next */ []));
+    // ── 输出 ──────────────────────────────────────────────────────────
+    cellChanged = output();
+    rowDeleted = output();
+    iconClicked = output();
+    batchUpdated = output();
+    rowReordered = output();
+    scrollNearBottom = output();
+    cellTooltip = this.#cellTooltip;
+    headerHeight = this.#headerHeight;
+    get tableInstance() {
+        return this.#tableInstance;
+    }
+    constructor() {
+        if (isPlatformBrowser(this.#platformId)) {
+            afterNextRender(() => {
+                if (this.#destroyed)
+                    return;
+                const el = this.tableContainer()?.nativeElement;
+                if (el && !this.#tableInstance && this.columns()?.length) {
+                    this.#initTable(el);
+                    this.#prevColumns = this.columns();
+                    this.#tableReady.set(true);
+                }
+            });
+            effect(() => {
+                const records = this.records();
+                const columns = this.columns();
+                const ready = untracked(() => this.#tableReady());
+                if (!this.#tableInstance) {
+                    if (!ready && columns?.length) {
+                        const el = this.tableContainer()?.nativeElement;
+                        if (el) {
+                            this.#initTable(el);
+                            this.#prevColumns = columns;
+                            this.#tableReady.set(true);
+                        }
+                    }
+                    return;
+                }
+                const columnsChanged = columns !== this.#prevColumns;
+                if (columnsChanged) {
+                    updateTableRecords(this.#tableInstance, records, this.#prevColumns ?? columns, columns);
+                    this.#prevColumns = columns;
+                    this.#prevRecords = records;
+                }
+                else if (records !== this.#prevRecords) {
+                    this.#tableInstance.setRecords(records);
+                    this.#prevRecords = records;
+                }
+            });
+            effect(() => {
+                this.isDarkMode();
+                this.redrawTheme();
+            });
+        }
+    }
+    /**
+     * 从业务层回滚单元格值（校验失败时恢复原值）。
+     * 避免外部直接访问 tableInstance。
+     */
+    changeCellValue(col, row, value) {
+        if (this.#tableInstance)
+            changeCellValue(this.#tableInstance, col, row, value);
+    }
+    redrawTheme() {
+        if (this.#tableInstance) {
+            this.#tableInstance.updateTheme(createTheme(this.isDarkMode(), getCSSVariables()));
+        }
+    }
+    ngOnDestroy() {
+        this.#destroyed = true;
+        this.#tooltip.cleanup();
+        if (this.#containerKeydownHandler) {
+            this.#container?.removeEventListener('keydown', this.#containerKeydownHandler);
+            this.#containerKeydownHandler = null;
+        }
+        this.#resizeObserver?.disconnect();
+        this.#resizeObserver = null;
+        if (this.#tableInstance) {
+            completeTableEdit(this.#tableInstance);
+            this.#tableInstance.release();
+        }
+        this.#tableInstance = null;
+        this.#container = null;
+        this.#tableReady.set(false);
+    }
+    #initTable(container) {
+        const records = this.records();
+        const table = createListTable(container, records, this.columns(), this.isDarkMode(), this.tableOptions());
+        this.#tableInstance = table;
+        this.#prevRecords = records;
+        this.#container = container;
+        const h = table.getRowHeight(0);
+        if (h > 0)
+            this.#headerHeight.set(h);
+        this.#resizeObserver = new ResizeObserver(() => table.resize());
+        this.#resizeObserver.observe(container);
+        table.updateTheme(createTheme(this.isDarkMode(), getCSSVariables()));
+        patchDragIconForReadonlyRows(table);
+        this.#bindTableEvents(table, container);
+    }
+    #bindTableEvents(table, container) {
+        table.on('change_cell_value', (args) => {
+            this.#handleCellChange(args.col, args.row, args.changedValue);
+        });
+        table.on('switch_state_change', (args) => {
+            this.#handleCellChange(args.col, args.row, args.checked);
+        });
+        table.on('checkbox_state_change', (args) => {
+            this.#handleCellChange(args.col, args.row, args.checked);
+        });
+        table.on('icon_click', (args) => {
+            completeTableEdit(table);
+            const record = table.getRecordByCell(args.col, args.row);
+            if (!record)
+                return;
+            if (args.name === 'delete-action')
+                this.rowDeleted.emit(record);
+            else
+                this.iconClicked.emit({ name: args.name, record });
+        });
+        table.on('mouseenter_cell', (args) => this.#showCellError(args.col, args.row));
+        table.on('mouseleave_cell', () => this.#tooltip.hide(v => this.#cellTooltip.set(v)));
+        table.on('selected_cell', (args) => {
+            this.#selectedCell = { col: args.col, row: args.row };
+        });
+        table.on('change_header_position', () => {
+            const ids = collectReorderedIds(table, this.idField());
+            if (ids.length > 0)
+                this.rowReordered.emit(ids);
+        });
+        table.on('scroll', (args) => {
+            if (args.scrollDirection === 'vertical' &&
+                (args.dy ?? 0) > 0 &&
+                (args.scrollRatioY ?? 0) > 0.9 &&
+                !this.loadingMore()) {
+                const fn = this.loadMore();
+                if (fn) {
+                    fn();
+                }
+                else {
+                    this.scrollNearBottom.emit();
+                }
+            }
+        });
+        this.#containerKeydownHandler = (e) => handleTableKeydown({
+            getTable: () => this.#tableInstance,
+            getSelectedCell: () => this.#selectedCell,
+            getColDef: col => this.#getColDef(col),
+            onCopy: () => void this.#clipboard.copy(table, this.columns()),
+            onPaste: () => void this.#pasteFromClipboard(),
+            onDelete: () => this.#deleteSelectedCells(),
+            onCellChange: (col, row, val) => this.#handleCellChange(col, row, val)
+        }, e);
+        container.addEventListener('keydown', this.#containerKeydownHandler);
+    }
+    #getColDef(col) {
+        return this.columns()?.[col - ROW_SERIES_COL_OFFSET];
+    }
+    #handleCellChange(col, row, changedValue) {
+        const record = this.#tableInstance?.getRecordByCell(col, row);
+        const fieldName = this.#getColDef(col)?.field;
+        if (!record || !fieldName)
+            return;
+        this.cellChanged.emit({ col, row, field: fieldName, value: changedValue, record });
+    }
+    #showCellError(col, row) {
+        const table = this.#tableInstance;
+        if (!table)
+            return;
+        const detector = this.cellErrorDetector();
+        if (!detector)
+            return;
+        const record = table.getRecordByCell(col, row);
+        if (!record)
+            return;
+        const field = this.#getColDef(col)?.field;
+        if (!field)
+            return;
+        const content = detector(record, field);
+        if (!content)
+            return;
+        this.#tooltip.showError(table, col, row, content, v => this.#cellTooltip.set(v), this.#config?.tooltipDelay);
+    }
+    /** 将 PendingWrite[] 按 idField 归并为 BatchChangeItem[] */
+    #groupWrites(writes) {
+        const map = new Map();
+        for (const w of writes) {
+            const id = String(w.record[this.idField()]);
+            if (!map.has(id))
+                map.set(id, {});
+            map.get(id)[w.field] = w.value;
+        }
+        return [...map.entries()].map(([recordId, changes]) => ({ recordId, changes }));
+    }
+    async #pasteFromClipboard() {
+        if (!this.#tableInstance)
+            return;
+        const writes = await this.#clipboard.paste(this.#tableInstance, this.columns());
+        if (writes.length > 0) {
+            for (const w of writes) {
+                if (typeof w.value === 'boolean') {
+                    setCellSwitchState(this.#tableInstance, w.col, w.row, w.value);
+                }
+            }
+            this.batchUpdated.emit(this.#groupWrites(writes));
+        }
+    }
+    #deleteSelectedCells() {
+        const table = this.#tableInstance;
+        if (!table)
+            return;
+        const columns = this.columns();
+        const { writes, boolCells } = collectDeleteWrites(table, columns, this.nonClearableFields(), this.cellClearable());
+        for (const bc of boolCells)
+            setCellSwitchState(table, bc.col, bc.row, false);
+        if (writes.length > 0)
+            this.batchUpdated.emit(this.#groupWrites(writes));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: EntityTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: EntityTableComponent, isStandalone: true, selector: "rxdb-entity-table", inputs: { records: { classPropertyName: "records", publicName: "records", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, isDarkMode: { classPropertyName: "isDarkMode", publicName: "isDarkMode", isSignal: true, isRequired: false, transformFunction: null }, idField: { classPropertyName: "idField", publicName: "idField", isSignal: true, isRequired: false, transformFunction: null }, nonClearableFields: { classPropertyName: "nonClearableFields", publicName: "nonClearableFields", isSignal: true, isRequired: false, transformFunction: null }, tableOptions: { classPropertyName: "tableOptions", publicName: "tableOptions", isSignal: true, isRequired: false, transformFunction: null }, cellErrorDetector: { classPropertyName: "cellErrorDetector", publicName: "cellErrorDetector", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, cellClearable: { classPropertyName: "cellClearable", publicName: "cellClearable", isSignal: true, isRequired: false, transformFunction: null }, loadMore: { classPropertyName: "loadMore", publicName: "loadMore", isSignal: true, isRequired: false, transformFunction: null }, loadingMore: { classPropertyName: "loadingMore", publicName: "loadingMore", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cellChanged: "cellChanged", rowDeleted: "rowDeleted", iconClicked: "iconClicked", batchUpdated: "batchUpdated", rowReordered: "rowReordered", scrollNearBottom: "scrollNearBottom" }, viewQueries: [{ propertyName: "tableContainer", first: true, predicate: ["tableContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"relative h-full w-full overflow-hidden\">\n  <div class=\"absolute inset-0\" #tableContainer></div>\n  @if (records().length === 0 && !loading()) {\n    <div\n      class=\"text-base-content/40 absolute inset-x-0 bottom-0 flex items-center justify-center text-sm\"\n      [style.top.px]=\"headerHeight()\"\n      aria-label=\"\u6682\u65E0\u6570\u636E\"\n      role=\"status\"\n    >\n      <div class=\"empty-slot\">\n        <ng-content select=\"[emptyState]\"></ng-content>\n      </div>\n      <div class=\"empty-default flex flex-col items-center gap-3\">\n        <svg\n          aria-hidden=\"true\"\n          fill=\"none\"\n          height=\"40\"\n          stroke=\"currentColor\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          stroke-width=\"1.2\"\n          viewBox=\"0 0 24 24\"\n          width=\"40\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <rect height=\"18\" rx=\"2\" width=\"18\" x=\"3\" y=\"3\" />\n          <path d=\"M3 9h18\" />\n          <path d=\"M9 9v12\" />\n          <path d=\"M3 15h18\" />\n        </svg>\n        <span>\u6682\u65E0\u6570\u636E</span>\n      </div>\n    </div>\n  }\n  @if (loading()) {\n    <div class=\"bg-base-100/60 absolute inset-0 z-10 flex items-center justify-center\">\n      <span class=\"loading loading-spinner loading-md text-primary\"></span>\n    </div>\n  }\n  @if (loadingMore()) {\n    <div class=\"pointer-events-none absolute right-0 bottom-0 left-0 z-10 flex justify-center py-1.5\">\n      <span class=\"loading loading-dots loading-sm text-primary\"></span>\n    </div>\n  }\n  @if (cellTooltip(); as tip) {\n    <div\n      class=\"bg-base-300 text-base-content border-base-300 pointer-events-none fixed z-[100] max-w-xs rounded border px-2 py-1.5 text-xs shadow-lg\"\n      [style.left.px]=\"tip.x\"\n      [style.top.px]=\"tip.y\"\n      aria-atomic=\"true\"\n      aria-live=\"assertive\"\n      role=\"tooltip\"\n    >\n      {{ tip.content }}\n    </div>\n  }\n</div>\n", styles: [":host{display:block;width:100%;height:100%;min-height:200px}.empty-slot:has(>*)~.empty-default{display:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: EntityTableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rxdb-entity-table', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"relative h-full w-full overflow-hidden\">\n  <div class=\"absolute inset-0\" #tableContainer></div>\n  @if (records().length === 0 && !loading()) {\n    <div\n      class=\"text-base-content/40 absolute inset-x-0 bottom-0 flex items-center justify-center text-sm\"\n      [style.top.px]=\"headerHeight()\"\n      aria-label=\"\u6682\u65E0\u6570\u636E\"\n      role=\"status\"\n    >\n      <div class=\"empty-slot\">\n        <ng-content select=\"[emptyState]\"></ng-content>\n      </div>\n      <div class=\"empty-default flex flex-col items-center gap-3\">\n        <svg\n          aria-hidden=\"true\"\n          fill=\"none\"\n          height=\"40\"\n          stroke=\"currentColor\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          stroke-width=\"1.2\"\n          viewBox=\"0 0 24 24\"\n          width=\"40\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <rect height=\"18\" rx=\"2\" width=\"18\" x=\"3\" y=\"3\" />\n          <path d=\"M3 9h18\" />\n          <path d=\"M9 9v12\" />\n          <path d=\"M3 15h18\" />\n        </svg>\n        <span>\u6682\u65E0\u6570\u636E</span>\n      </div>\n    </div>\n  }\n  @if (loading()) {\n    <div class=\"bg-base-100/60 absolute inset-0 z-10 flex items-center justify-center\">\n      <span class=\"loading loading-spinner loading-md text-primary\"></span>\n    </div>\n  }\n  @if (loadingMore()) {\n    <div class=\"pointer-events-none absolute right-0 bottom-0 left-0 z-10 flex justify-center py-1.5\">\n      <span class=\"loading loading-dots loading-sm text-primary\"></span>\n    </div>\n  }\n  @if (cellTooltip(); as tip) {\n    <div\n      class=\"bg-base-300 text-base-content border-base-300 pointer-events-none fixed z-[100] max-w-xs rounded border px-2 py-1.5 text-xs shadow-lg\"\n      [style.left.px]=\"tip.x\"\n      [style.top.px]=\"tip.y\"\n      aria-atomic=\"true\"\n      aria-live=\"assertive\"\n      role=\"tooltip\"\n    >\n      {{ tip.content }}\n    </div>\n  }\n</div>\n", styles: [":host{display:block;width:100%;height:100%;min-height:200px}.empty-slot:has(>*)~.empty-default{display:none}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { tableContainer: [{ type: i0.ViewChild, args: ['tableContainer', { isSignal: true }] }], records: [{ type: i0.Input, args: [{ isSignal: true, alias: "records", required: true }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], isDarkMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDarkMode", required: false }] }], idField: [{ type: i0.Input, args: [{ isSignal: true, alias: "idField", required: false }] }], nonClearableFields: [{ type: i0.Input, args: [{ isSignal: true, alias: "nonClearableFields", required: false }] }], tableOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableOptions", required: false }] }], cellErrorDetector: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellErrorDetector", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], cellClearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellClearable", required: false }] }], loadMore: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadMore", required: false }] }], loadingMore: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingMore", required: false }] }], cellChanged: [{ type: i0.Output, args: ["cellChanged"] }], rowDeleted: [{ type: i0.Output, args: ["rowDeleted"] }], iconClicked: [{ type: i0.Output, args: ["iconClicked"] }], batchUpdated: [{ type: i0.Output, args: ["batchUpdated"] }], rowReordered: [{ type: i0.Output, args: ["rowReordered"] }], scrollNearBottom: [{ type: i0.Output, args: ["scrollNearBottom"] }] } });
+
+/**
+ * 集成查询构建器的实体表格组件
+ *
+ * 在实体表格上方提供筛选区域位置（通过内容投影），
+ * 将 rxdb-query-builder 的查询结果传递给底层 EntityTableComponent。
+ *
+ * 使用方式：
+ * ```html
+ * <rxdb-query-table [records]="filteredRecords()" [columns]="columns">
+ *   <div filterBar>
+ *     <rxdb-query-builder [fields]="fields" (queryChange)="onQueryChange($event)" />
+ *   </div>
+ *   <div emptyState>暂无数据</div>
+ * </rxdb-query-table>
+ * ```
+ */
+class QueryTableComponent {
+    records = input.required(...(ngDevMode ? [{ debugName: "records" }] : /* istanbul ignore next */ []));
+    columns = input.required(...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
+    idField = input('id', ...(ngDevMode ? [{ debugName: "idField" }] : /* istanbul ignore next */ []));
+    nonClearableFields = input(new Set(), ...(ngDevMode ? [{ debugName: "nonClearableFields" }] : /* istanbul ignore next */ []));
+    tableOptions = input(...(ngDevMode ? [undefined, { debugName: "tableOptions" }] : /* istanbul ignore next */ []));
+    cellErrorDetector = input(...(ngDevMode ? [undefined, { debugName: "cellErrorDetector" }] : /* istanbul ignore next */ []));
+    isDarkMode = input(false, ...(ngDevMode ? [{ debugName: "isDarkMode" }] : /* istanbul ignore next */ []));
+    /** 业务层回调判断单元格是否可清空 */
+    cellClearable = input(...(ngDevMode ? [undefined, { debugName: "cellClearable" }] : /* istanbul ignore next */ []));
+    /** 查询条件是否激活（显示筛选状态标签） */
+    queryActive = input(false, ...(ngDevMode ? [{ debugName: "queryActive" }] : /* istanbul ignore next */ []));
+    /** 结果总数（显示在筛选状态栏中） */
+    totalCount = input(...(ngDevMode ? [undefined, { debugName: "totalCount" }] : /* istanbul ignore next */ []));
+    /** 筛选后结果数 */
+    filteredCount = input(...(ngDevMode ? [undefined, { debugName: "filteredCount" }] : /* istanbul ignore next */ []));
+    /** 是否显示加载状态 */
+    loading = input(false, ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
+    /** 加载更多中（已有数据，底部小 spinner，不拦截滚动） */
+    loadingMore = input(false, ...(ngDevMode ? [{ debugName: "loadingMore" }] : /* istanbul ignore next */ []));
+    /** 触底时加载更多数据的回调，透传给 EntityTableComponent */
+    loadMore = input(...(ngDevMode ? [undefined, { debugName: "loadMore" }] : /* istanbul ignore next */ []));
+    cellChanged = output();
+    rowDeleted = output();
+    iconClicked = output();
+    batchUpdated = output();
+    rowReordered = output();
+    scrollNearBottom = output();
+    entityTable = viewChild(EntityTableComponent, ...(ngDevMode ? [{ debugName: "entityTable" }] : /* istanbul ignore next */ []));
+    statusText = computed(() => {
+        const total = this.totalCount();
+        const filtered = this.filteredCount();
+        if (total == null)
+            return '';
+        if (filtered != null && filtered !== total)
+            return `${filtered} / ${total}`;
+        return `${total}`;
+    }, ...(ngDevMode ? [{ debugName: "statusText" }] : /* istanbul ignore next */ []));
+    get tableInstance() {
+        return this.entityTable()?.tableInstance ?? null;
+    }
+    changeCellValue(col, row, value) {
+        this.entityTable()?.changeCellValue(col, row, value);
+    }
+    redrawTheme() {
+        this.entityTable()?.redrawTheme();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: QueryTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: QueryTableComponent, isStandalone: true, selector: "rxdb-query-table", inputs: { records: { classPropertyName: "records", publicName: "records", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, idField: { classPropertyName: "idField", publicName: "idField", isSignal: true, isRequired: false, transformFunction: null }, nonClearableFields: { classPropertyName: "nonClearableFields", publicName: "nonClearableFields", isSignal: true, isRequired: false, transformFunction: null }, tableOptions: { classPropertyName: "tableOptions", publicName: "tableOptions", isSignal: true, isRequired: false, transformFunction: null }, cellErrorDetector: { classPropertyName: "cellErrorDetector", publicName: "cellErrorDetector", isSignal: true, isRequired: false, transformFunction: null }, isDarkMode: { classPropertyName: "isDarkMode", publicName: "isDarkMode", isSignal: true, isRequired: false, transformFunction: null }, cellClearable: { classPropertyName: "cellClearable", publicName: "cellClearable", isSignal: true, isRequired: false, transformFunction: null }, queryActive: { classPropertyName: "queryActive", publicName: "queryActive", isSignal: true, isRequired: false, transformFunction: null }, totalCount: { classPropertyName: "totalCount", publicName: "totalCount", isSignal: true, isRequired: false, transformFunction: null }, filteredCount: { classPropertyName: "filteredCount", publicName: "filteredCount", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, loadingMore: { classPropertyName: "loadingMore", publicName: "loadingMore", isSignal: true, isRequired: false, transformFunction: null }, loadMore: { classPropertyName: "loadMore", publicName: "loadMore", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cellChanged: "cellChanged", rowDeleted: "rowDeleted", iconClicked: "iconClicked", batchUpdated: "batchUpdated", rowReordered: "rowReordered", scrollNearBottom: "scrollNearBottom" }, viewQueries: [{ propertyName: "entityTable", first: true, predicate: EntityTableComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"flex h-full w-full flex-col overflow-hidden\">\n  <!-- \u7B5B\u9009\u680F\u63D2\u69FD -->\n  <ng-content select=\"[filterBar]\"></ng-content>\n\n  <!-- \u7B5B\u9009\u72B6\u6001\u680F -->\n  @if (queryActive() && statusText()) {\n    <div class=\"text-base-content/60 flex items-center gap-2 border-b px-3 py-1 text-xs\">\n      <span>{{ statusText() }}</span>\n    </div>\n  }\n\n  <!-- \u8868\u683C\u4E3B\u4F53 -->\n  <div class=\"min-h-0 flex-1\">\n    <rxdb-entity-table\n      [cellClearable]=\"cellClearable()\"\n      [cellErrorDetector]=\"cellErrorDetector()\"\n      [columns]=\"columns()\"\n      [idField]=\"idField()\"\n      [isDarkMode]=\"isDarkMode()\"\n      [loading]=\"loading()\"\n      [loadingMore]=\"loadingMore()\"\n      [loadMore]=\"loadMore()\"\n      [nonClearableFields]=\"nonClearableFields()\"\n      [records]=\"records()\"\n      [tableOptions]=\"tableOptions()\"\n      (batchUpdated)=\"batchUpdated.emit($event)\"\n      (cellChanged)=\"cellChanged.emit($event)\"\n      (iconClicked)=\"iconClicked.emit($event)\"\n      (rowDeleted)=\"rowDeleted.emit($event)\"\n      (rowReordered)=\"rowReordered.emit($event)\"\n      (scrollNearBottom)=\"scrollNearBottom.emit()\"\n    >\n      <ng-content select=\"[emptyState]\"></ng-content>\n    </rxdb-entity-table>\n  </div>\n</div>\n", styles: [":host{display:block;width:100%;height:100%}\n"], dependencies: [{ kind: "component", type: EntityTableComponent, selector: "rxdb-entity-table", inputs: ["records", "columns", "isDarkMode", "idField", "nonClearableFields", "tableOptions", "cellErrorDetector", "loading", "cellClearable", "loadMore", "loadingMore"], outputs: ["cellChanged", "rowDeleted", "iconClicked", "batchUpdated", "rowReordered", "scrollNearBottom"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: QueryTableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rxdb-query-table', imports: [EntityTableComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex h-full w-full flex-col overflow-hidden\">\n  <!-- \u7B5B\u9009\u680F\u63D2\u69FD -->\n  <ng-content select=\"[filterBar]\"></ng-content>\n\n  <!-- \u7B5B\u9009\u72B6\u6001\u680F -->\n  @if (queryActive() && statusText()) {\n    <div class=\"text-base-content/60 flex items-center gap-2 border-b px-3 py-1 text-xs\">\n      <span>{{ statusText() }}</span>\n    </div>\n  }\n\n  <!-- \u8868\u683C\u4E3B\u4F53 -->\n  <div class=\"min-h-0 flex-1\">\n    <rxdb-entity-table\n      [cellClearable]=\"cellClearable()\"\n      [cellErrorDetector]=\"cellErrorDetector()\"\n      [columns]=\"columns()\"\n      [idField]=\"idField()\"\n      [isDarkMode]=\"isDarkMode()\"\n      [loading]=\"loading()\"\n      [loadingMore]=\"loadingMore()\"\n      [loadMore]=\"loadMore()\"\n      [nonClearableFields]=\"nonClearableFields()\"\n      [records]=\"records()\"\n      [tableOptions]=\"tableOptions()\"\n      (batchUpdated)=\"batchUpdated.emit($event)\"\n      (cellChanged)=\"cellChanged.emit($event)\"\n      (iconClicked)=\"iconClicked.emit($event)\"\n      (rowDeleted)=\"rowDeleted.emit($event)\"\n      (rowReordered)=\"rowReordered.emit($event)\"\n      (scrollNearBottom)=\"scrollNearBottom.emit()\"\n    >\n      <ng-content select=\"[emptyState]\"></ng-content>\n    </rxdb-entity-table>\n  </div>\n</div>\n", styles: [":host{display:block;width:100%;height:100%}\n"] }]
+        }], propDecorators: { records: [{ type: i0.Input, args: [{ isSignal: true, alias: "records", required: true }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], idField: [{ type: i0.Input, args: [{ isSignal: true, alias: "idField", required: false }] }], nonClearableFields: [{ type: i0.Input, args: [{ isSignal: true, alias: "nonClearableFields", required: false }] }], tableOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableOptions", required: false }] }], cellErrorDetector: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellErrorDetector", required: false }] }], isDarkMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDarkMode", required: false }] }], cellClearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellClearable", required: false }] }], queryActive: [{ type: i0.Input, args: [{ isSignal: true, alias: "queryActive", required: false }] }], totalCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalCount", required: false }] }], filteredCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "filteredCount", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], loadingMore: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingMore", required: false }] }], loadMore: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadMore", required: false }] }], cellChanged: [{ type: i0.Output, args: ["cellChanged"] }], rowDeleted: [{ type: i0.Output, args: ["rowDeleted"] }], iconClicked: [{ type: i0.Output, args: ["iconClicked"] }], batchUpdated: [{ type: i0.Output, args: ["batchUpdated"] }], rowReordered: [{ type: i0.Output, args: ["rowReordered"] }], scrollNearBottom: [{ type: i0.Output, args: ["scrollNearBottom"] }], entityTable: [{ type: i0.ViewChild, args: [i0.forwardRef(() => EntityTableComponent), { isSignal: true }] }] } });
+
+let _uid$1 = 0;
+/**
+ * 树节点 Directive，实现 CDK {@link Highlightable} 接口
+ *
+ * 用于 {@link ActiveDescendantKeyManager} 管理键盘导航时的激活样式。
+ * `exportAs: 'rxdbTreeItem'` 允许模板中通过 `#ref="rxdbTreeItem"` 访问实例。
+ */
+class TreeItemDirective {
+    _active = signal(false, ...(ngDevMode ? [{ debugName: "_active" }] : /* istanbul ignore next */ []));
+    isActive = this._active.asReadonly();
+    setActiveStyles() {
+        this._active.set(true);
+    }
+    setInactiveStyles() {
+        this._active.set(false);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: TreeItemDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.5", type: TreeItemDirective, isStandalone: true, selector: "[rxdbTreeItem]", exportAs: ["rxdbTreeItem"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: TreeItemDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[rxdbTreeItem]',
+                    standalone: true,
+                    exportAs: 'rxdbTreeItem'
+                }]
+        }] });
+/**
+ * 树形下拉选择组件
+ *
+ * @description
+ * 基于 Popover API 和 `@angular/cdk/a11y` 的树形字段选择器：
+ * - 使用原生 Popover API，在 `overflow` 容器中不被裁剪
+ * - 支持关键字过滤（自动展开匹配路径）
+ * - 支持展开/折叠关系节点
+ * - 键盘导航：↑↓ 移动、→ 展开、← 折叠、Enter 选中、Escape 关闭
+ * - 使用 CDK `ActiveDescendantKeyManager` + `aria-activedescendant` 满足 WAI-ARIA 无障碍规范
+ *
+ * @example
+ * ```html
+ * <rxdb-tree-select
+ *   [nodes]="fieldTree()"
+ *   [selected]="selectedField()"
+ *   placeholder="选择字段"
+ *   (selectChange)="onFieldSelect($event)"
+ * />
+ * ```
+ */
+class TreeSelectComponent {
+    trigger = viewChild.required('trigger');
+    popoverEl = viewChild.required('popoverEl');
+    filterInput = viewChild('filterInput', ...(ngDevMode ? [{ debugName: "filterInput" }] : /* istanbul ignore next */ []));
+    treeItemDirs = viewChildren(TreeItemDirective, ...(ngDevMode ? [{ debugName: "treeItemDirs" }] : /* istanbul ignore next */ []));
+    expandedPaths = signal(new Set(), ...(ngDevMode ? [{ debugName: "expandedPaths" }] : /* istanbul ignore next */ []));
+    keyManager;
+    _activeIdx = signal(-1, ...(ngDevMode ? [{ debugName: "_activeIdx" }] : /* istanbul ignore next */ []));
+    uid = `rxdb-ts-${++_uid$1}`;
+    listId = `${this.uid}-list`;
+    filterText = signal('', ...(ngDevMode ? [{ debugName: "filterText" }] : /* istanbul ignore next */ []));
+    ChevronDownIcon = ChevronDownIcon;
+    ChevronRightIcon = ChevronRightIcon;
+    typeIconMap = {
+        string: TypeIcon,
+        number: HashIcon,
+        boolean: ToggleLeftIcon,
+        date: CalendarIcon,
+        array: ListIcon,
+        object: BracesIcon,
+        relation: Link2Icon,
+        enum: ListChecksIcon,
+        keyValue: TableIcon
+    };
+    typeColorMap = {
+        string: 'text-success',
+        number: 'text-warning',
+        boolean: 'text-info',
+        date: 'text-secondary',
+        array: 'text-accent',
+        object: 'text-base-content/60',
+        relation: 'text-primary',
+        enum: 'text-warning',
+        keyValue: 'text-accent'
+    };
+    defaultTypeIcon = TypeIcon;
+    defaultTypeColor = 'text-base-content/40';
+    nodes = input.required(...(ngDevMode ? [{ debugName: "nodes" }] : /* istanbul ignore next */ []));
+    selected = input('', ...(ngDevMode ? [{ debugName: "selected" }] : /* istanbul ignore next */ []));
+    placeholder = input('请选择', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    minWidth = input('14rem', ...(ngDevMode ? [{ debugName: "minWidth" }] : /* istanbul ignore next */ []));
+    selectChange = output();
+    displayValue = computed(() => {
+        const sel = this.selected();
+        return sel ? getDisplayNamePath(this.nodes(), sel) || sel : this.placeholder();
+    }, ...(ngDevMode ? [{ debugName: "displayValue" }] : /* istanbul ignore next */ []));
+    selectedNode = computed(() => {
+        const sel = this.selected();
+        return sel ? findNodeByValue(this.nodes(), sel) : null;
+    }, ...(ngDevMode ? [{ debugName: "selectedNode" }] : /* istanbul ignore next */ []));
+    visibleItems = computed(() => {
+        const filter = this.filterText().toLowerCase().trim();
+        const expanded = this.expandedPaths();
+        return filter ? buildFilteredItems(this.nodes(), filter) : buildExpandedItems(this.nodes(), expanded, 0);
+    }, ...(ngDevMode ? [{ debugName: "visibleItems" }] : /* istanbul ignore next */ []));
+    activeItemId = computed(() => {
+        const idx = this._activeIdx();
+        if (idx < 0)
+            return null;
+        const vis = this.visibleItems();
+        return idx < vis.length ? `${this.uid}-item-${vis[idx].node.value}` : null;
+    }, ...(ngDevMode ? [{ debugName: "activeItemId" }] : /* istanbul ignore next */ []));
+    constructor() {
+        const injector = inject(Injector);
+        // Signal 初始化必须在 injection context 内（constructor）
+        this.keyManager = new ActiveDescendantKeyManager(this.treeItemDirs, injector).withWrap().withHomeAndEnd();
+        // 同步 key manager 的激活索引到本地 signal（用于 aria-activedescendant）
+        this.keyManager.change.pipe(takeUntilDestroyed()).subscribe(idx => this._activeIdx.set(idx));
+        // 过滤文本变化时，自动高亮第一项
+        effect(() => {
+            this.filterText();
+            untracked(() => {
+                setTimeout(() => {
+                    this.keyManager.setFirstItemActive();
+                    this._activeIdx.set(this.keyManager.activeItemIndex ?? -1);
+                });
+            });
+        });
+    }
+    onBeforeToggle(event) {
+        const te = event;
+        if (te.newState === 'open') {
+            applyPopoverPosition(this.popoverEl().nativeElement, this.trigger().nativeElement.getBoundingClientRect());
+            this.filterText.set('');
+        }
+        else {
+            this._activeIdx.set(-1);
+            this.keyManager.setActiveItem(-1);
+        }
+    }
+    onToggle(event) {
+        if (event.newState === 'open') {
+            this.filterInput()?.nativeElement.focus();
+            setTimeout(() => {
+                this.keyManager.setFirstItemActive();
+                this._activeIdx.set(this.keyManager.activeItemIndex ?? -1);
+            });
+        }
+    }
+    onKeydown(event) {
+        switch (event.key) {
+            case 'ArrowDown':
+            case 'ArrowUp': {
+                event.preventDefault();
+                this.keyManager.onKeydown(event);
+                this.scrollActiveIntoView();
+                break;
+            }
+            case 'ArrowRight': {
+                event.preventDefault();
+                const item = this.visibleItems()[this.keyManager.activeItemIndex ?? -1];
+                if (item?.isExpandable && !item.isExpanded)
+                    this.toggleExpand(item.node.value);
+                break;
+            }
+            case 'ArrowLeft': {
+                event.preventDefault();
+                const item = this.visibleItems()[this.keyManager.activeItemIndex ?? -1];
+                if (item?.isExpandable && item.isExpanded)
+                    this.toggleExpand(item.node.value);
+                break;
+            }
+            case 'Enter': {
+                event.preventDefault();
+                const item = this.visibleItems()[this.keyManager.activeItemIndex ?? -1];
+                if (item)
+                    this.onItemClick(item);
+                break;
+            }
+            case 'Escape': {
+                event.preventDefault();
+                this.popoverEl().nativeElement.hidePopover();
+                this.trigger().nativeElement.focus();
+                break;
+            }
+            case 'Tab': {
+                this.popoverEl().nativeElement.hidePopover();
+                break;
+            }
+        }
+    }
+    onItemClick(item) {
+        if (item.isExpandable) {
+            this.toggleExpand(item.node.value);
+        }
+        else {
+            this.selectChange.emit(item.node.value);
+            this.popoverEl().nativeElement.hidePopover();
+            this.trigger().nativeElement.focus();
+        }
+    }
+    /** 追踪函数：使用 value + isExistsOption 避免重复 key */
+    trackItem(item) {
+        return item.node.isExistsOption ? `${item.node.value}:exists` : item.node.value;
+    }
+    scrollActiveIntoView() {
+        const idx = this.keyManager.activeItemIndex ?? -1;
+        const item = this.visibleItems()[idx];
+        if (!item)
+            return;
+        document.getElementById(`${this.uid}-item-${item.node.value}`)?.scrollIntoView({ block: 'nearest' });
+    }
+    toggleExpand(value) {
+        this.expandedPaths.update(prev => {
+            const next = new Set(prev);
+            if (next.has(value)) {
+                next.delete(value);
+            }
+            else {
+                next.add(value);
+            }
+            return next;
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: TreeSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: TreeSelectComponent, isStandalone: true, selector: "rxdb-tree-select", inputs: { nodes: { classPropertyName: "nodes", publicName: "nodes", isSignal: true, isRequired: true, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectChange: "selectChange" }, viewQueries: [{ propertyName: "trigger", first: true, predicate: ["trigger"], descendants: true, isSignal: true }, { propertyName: "popoverEl", first: true, predicate: ["popoverEl"], descendants: true, isSignal: true }, { propertyName: "filterInput", first: true, predicate: ["filterInput"], descendants: true, isSignal: true }, { propertyName: "treeItemDirs", predicate: TreeItemDirective, descendants: true, isSignal: true }], ngImport: i0, template: `
+    <!-- 触发按钮 -->
+    <button
+      class="select select-sm text-left"
+      #trigger
+      [attr.popovertarget]="uid"
+      [style.min-width]="minWidth()"
+      aria-haspopup="tree"
+      type="button"
+    >
+      @if (selectedNode(); as node) {
+        <lucide-icon
+          class="w-3.5 shrink-0"
+          [class]="typeColorMap[node.type] ?? defaultTypeColor"
+          [img]="typeIconMap[node.type] ?? defaultTypeIcon"
+          size="14"
+        />
+      }
+      <span class="min-w-0 grow truncate">{{ displayValue() }}</span>
+    </button>
+
+    <!-- Popover 浮层 -->
+    <div
+      class="bg-base-100 text-base-content rounded-box border-base-300 border shadow-xl"
+      #popoverEl
+      [id]="uid"
+      [style.min-width]="minWidth()"
+      (beforetoggle)="onBeforeToggle($event)"
+      (keydown)="onKeydown($event)"
+      (toggle)="onToggle($event)"
+      popover
+      tabindex="-1"
+    >
+      <!-- 过滤输入框 -->
+      <div class="mb-1 p-1">
+        <input
+          class="input input-sm w-full"
+          #filterInput
+          [attr.aria-activedescendant]="activeItemId()"
+          [attr.aria-controls]="listId"
+          [attr.aria-expanded]="true"
+          [attr.aria-owns]="listId"
+          [ngModel]="filterText()"
+          (ngModelChange)="filterText.set($event)"
+          aria-autocomplete="list"
+          placeholder="搜索字段..."
+          role="combobox"
+          type="text"
+        />
+      </div>
+
+      <!-- 树形列表 -->
+      <ul
+        class="menu menu-sm max-h-60 w-full flex-nowrap overflow-y-auto px-2"
+        [attr.aria-label]="placeholder()"
+        [id]="listId"
+        role="tree"
+      >
+        @for (item of visibleItems(); track trackItem(item)) {
+          <li [style.padding-left.rem]="item.depth * 0.75" role="none">
+            <button
+              class="flex w-full items-center gap-1.5 text-left text-sm"
+              #treeItemRef="rxdbTreeItem"
+              [attr.aria-expanded]="item.isExpandable ? item.isExpanded : null"
+              [attr.aria-selected]="!item.isExpandable ? item.node.value === selected() : null"
+              [class.bg-primary/15]="!item.isExpandable && item.node.value === selected()"
+              [class.font-semibold]="!item.isExpandable && item.node.value === selected()"
+              [class.menu-focus]="treeItemRef.isActive()"
+              [id]="uid + '-item-' + item.node.value"
+              (click)="onItemClick(item)"
+              role="treeitem"
+              rxdbTreeItem
+              type="button"
+            >
+              <lucide-icon
+                class="w-3.5 shrink-0"
+                [class]="typeColorMap[item.node.type] ?? defaultTypeColor"
+                [img]="typeIconMap[item.node.type] ?? defaultTypeIcon"
+                size="14"
+              />
+              <span class="min-w-0 grow truncate">{{ item.node.displayName || item.node.label }}</span>
+              @if (!item.isExpandable && item.node.value === selected()) {
+                <svg
+                  class="text-primary h-3 w-3 shrink-0"
+                  fill="none"
+                  stroke="currentColor"
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2.5"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <polyline points="20 6 9 17 4 12" />
+                </svg>
+              }
+              @if (item.isExpandable) {
+                <span class="shrink-0 text-xs opacity-40">{{ item.node.children!.length }}</span>
+                @if (item.isExpanded) {
+                  <lucide-icon class="w-3.5 shrink-0 opacity-50" [img]="ChevronDownIcon" size="14" />
+                } @else {
+                  <lucide-icon class="w-3.5 shrink-0 opacity-50" [img]="ChevronRightIcon" size="14" />
+                }
+              }
+            </button>
+          </li>
+        } @empty {
+          <li class="px-3 py-1.5 text-sm opacity-50">无匹配字段</li>
+        }
+      </ul>
+    </div>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: TreeItemDirective, selector: "[rxdbTreeItem]", exportAs: ["rxdbTreeItem"] }, { kind: "ngmodule", type: LucideAngularModule }, { kind: "component", type: i2.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: TreeSelectComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'rxdb-tree-select',
+                    standalone: true,
+                    imports: [FormsModule, TreeItemDirective, LucideAngularModule],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: `
+    <!-- 触发按钮 -->
+    <button
+      class="select select-sm text-left"
+      #trigger
+      [attr.popovertarget]="uid"
+      [style.min-width]="minWidth()"
+      aria-haspopup="tree"
+      type="button"
+    >
+      @if (selectedNode(); as node) {
+        <lucide-icon
+          class="w-3.5 shrink-0"
+          [class]="typeColorMap[node.type] ?? defaultTypeColor"
+          [img]="typeIconMap[node.type] ?? defaultTypeIcon"
+          size="14"
+        />
+      }
+      <span class="min-w-0 grow truncate">{{ displayValue() }}</span>
+    </button>
+
+    <!-- Popover 浮层 -->
+    <div
+      class="bg-base-100 text-base-content rounded-box border-base-300 border shadow-xl"
+      #popoverEl
+      [id]="uid"
+      [style.min-width]="minWidth()"
+      (beforetoggle)="onBeforeToggle($event)"
+      (keydown)="onKeydown($event)"
+      (toggle)="onToggle($event)"
+      popover
+      tabindex="-1"
+    >
+      <!-- 过滤输入框 -->
+      <div class="mb-1 p-1">
+        <input
+          class="input input-sm w-full"
+          #filterInput
+          [attr.aria-activedescendant]="activeItemId()"
+          [attr.aria-controls]="listId"
+          [attr.aria-expanded]="true"
+          [attr.aria-owns]="listId"
+          [ngModel]="filterText()"
+          (ngModelChange)="filterText.set($event)"
+          aria-autocomplete="list"
+          placeholder="搜索字段..."
+          role="combobox"
+          type="text"
+        />
+      </div>
+
+      <!-- 树形列表 -->
+      <ul
+        class="menu menu-sm max-h-60 w-full flex-nowrap overflow-y-auto px-2"
+        [attr.aria-label]="placeholder()"
+        [id]="listId"
+        role="tree"
+      >
+        @for (item of visibleItems(); track trackItem(item)) {
+          <li [style.padding-left.rem]="item.depth * 0.75" role="none">
+            <button
+              class="flex w-full items-center gap-1.5 text-left text-sm"
+              #treeItemRef="rxdbTreeItem"
+              [attr.aria-expanded]="item.isExpandable ? item.isExpanded : null"
+              [attr.aria-selected]="!item.isExpandable ? item.node.value === selected() : null"
+              [class.bg-primary/15]="!item.isExpandable && item.node.value === selected()"
+              [class.font-semibold]="!item.isExpandable && item.node.value === selected()"
+              [class.menu-focus]="treeItemRef.isActive()"
+              [id]="uid + '-item-' + item.node.value"
+              (click)="onItemClick(item)"
+              role="treeitem"
+              rxdbTreeItem
+              type="button"
+            >
+              <lucide-icon
+                class="w-3.5 shrink-0"
+                [class]="typeColorMap[item.node.type] ?? defaultTypeColor"
+                [img]="typeIconMap[item.node.type] ?? defaultTypeIcon"
+                size="14"
+              />
+              <span class="min-w-0 grow truncate">{{ item.node.displayName || item.node.label }}</span>
+              @if (!item.isExpandable && item.node.value === selected()) {
+                <svg
+                  class="text-primary h-3 w-3 shrink-0"
+                  fill="none"
+                  stroke="currentColor"
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2.5"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <polyline points="20 6 9 17 4 12" />
+                </svg>
+              }
+              @if (item.isExpandable) {
+                <span class="shrink-0 text-xs opacity-40">{{ item.node.children!.length }}</span>
+                @if (item.isExpanded) {
+                  <lucide-icon class="w-3.5 shrink-0 opacity-50" [img]="ChevronDownIcon" size="14" />
+                } @else {
+                  <lucide-icon class="w-3.5 shrink-0 opacity-50" [img]="ChevronRightIcon" size="14" />
+                }
+              }
+            </button>
+          </li>
+        } @empty {
+          <li class="px-3 py-1.5 text-sm opacity-50">无匹配字段</li>
+        }
+      </ul>
+    </div>
+  `
+                }]
+        }], ctorParameters: () => [], propDecorators: { trigger: [{ type: i0.ViewChild, args: ['trigger', { isSignal: true }] }], popoverEl: [{ type: i0.ViewChild, args: ['popoverEl', { isSignal: true }] }], filterInput: [{ type: i0.ViewChild, args: ['filterInput', { isSignal: true }] }], treeItemDirs: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => TreeItemDirective), { isSignal: true }] }], nodes: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodes", required: true }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], minWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "minWidth", required: false }] }], selectChange: [{ type: i0.Output, args: ["selectChange"] }] } });
+// ─── 辅助函数 ───────────────────────────────────────────────────────────────────
+function buildExpandedItems(nodes, expanded, depth) {
+    const result = [];
+    for (const node of nodes) {
+        const isExpandable = !!node.children?.length;
+        const isExpanded = isExpandable && expanded.has(node.value);
+        result.push({ node, depth, isExpandable, isExpanded });
+        if (isExpanded) {
+            result.push(...buildExpandedItems(node.children, expanded, depth + 1));
+        }
+    }
+    return result;
+}
+function buildFilteredItems(nodes, filter, depth = 0) {
+    const result = [];
+    for (const node of nodes) {
+        const selfMatches = nodeMatchesFilter(node, filter);
+        const isExpandable = !!node.children?.length;
+        const childMatches = isExpandable && hasMatchingDescendant(node.children, filter);
+        if (selfMatches || childMatches) {
+            result.push({ node, depth, isExpandable, isExpanded: isExpandable && childMatches });
+            if (isExpandable && (selfMatches || childMatches)) {
+                result.push(...buildFilteredItems(node.children, filter, depth + 1));
+            }
+        }
+    }
+    return result;
+}
+function nodeMatchesFilter(node, filter) {
+    return (node.label.toLowerCase().includes(filter) ||
+        node.displayName.toLowerCase().includes(filter) ||
+        (node.description?.toLowerCase().includes(filter) ?? false));
+}
+function hasMatchingDescendant(nodes, filter) {
+    return nodes.some(n => nodeMatchesFilter(n, filter) || (n.children?.length ? hasMatchingDescendant(n.children, filter) : false));
+}
+
+/**
+ * 字段选择器组件
+ *
+ * @description
+ * 使用 Popover API 展示树形字段结构，支持过滤和嵌套关系字段的展开/折叠。
+ * 基于 CDK `ActiveDescendantKeyManager` 提供完整键盘导航和无障碍支持。
+ * 不依赖任何第三方 UI 库。
+ *
+ * 支持两种使用方式：
+ * 1. 直接模板使用：监听 `(fieldChange)` output 事件
+ * 2. 通过 NgComponentOutlet 注入：传入 `fieldChangeFn` 回调 input
+ */
+class FieldSelectorComponent {
+    fields = input.required(...(ngDevMode ? [{ debugName: "fields" }] : /* istanbul ignore next */ []));
+    selectedField = input('', ...(ngDevMode ? [{ debugName: "selectedField" }] : /* istanbul ignore next */ []));
+    placeholder = input('选择字段', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** 通过 NgComponentOutlet 注入时使用的回调 input */
+    fieldChangeFn = input(undefined, ...(ngDevMode ? [{ debugName: "fieldChangeFn" }] : /* istanbul ignore next */ []));
+    /** 直接模板使用时的 output 事件 */
+    fieldChange = output();
+    fieldTree = computed(() => buildFieldTree(this.fields()), ...(ngDevMode ? [{ debugName: "fieldTree" }] : /* istanbul ignore next */ []));
+    onSelect(field) {
+        this.fieldChange.emit(field);
+        this.fieldChangeFn()?.(field);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: FieldSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: FieldSelectorComponent, isStandalone: true, selector: "rxdb-field-selector", inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null }, selectedField: { classPropertyName: "selectedField", publicName: "selectedField", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, fieldChangeFn: { classPropertyName: "fieldChangeFn", publicName: "fieldChangeFn", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fieldChange: "fieldChange" }, ngImport: i0, template: `
+    <rxdb-tree-select
+      [nodes]="fieldTree()"
+      [placeholder]="placeholder()"
+      [selected]="selectedField()"
+      (selectChange)="onSelect($event)"
+      minWidth="14rem"
+    />
+  `, isInline: true, dependencies: [{ kind: "component", type: TreeSelectComponent, selector: "rxdb-tree-select", inputs: ["nodes", "selected", "placeholder", "minWidth"], outputs: ["selectChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: FieldSelectorComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'rxdb-field-selector',
+                    standalone: true,
+                    imports: [TreeSelectComponent],
+                    template: `
+    <rxdb-tree-select
+      [nodes]="fieldTree()"
+      [placeholder]="placeholder()"
+      [selected]="selectedField()"
+      (selectChange)="onSelect($event)"
+      minWidth="14rem"
+    />
+  `,
+                    changeDetection: ChangeDetectionStrategy.OnPush
+                }]
+        }], propDecorators: { fields: [{ type: i0.Input, args: [{ isSignal: true, alias: "fields", required: true }] }], selectedField: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedField", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], fieldChangeFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldChangeFn", required: false }] }], fieldChange: [{ type: i0.Output, args: ["fieldChange"] }] } });
+
+let _uid = 0;
+/**
+ * 基于 Popover API 的下拉选择组件
+ *
+ * @description
+ * 使用浏览器原生 Popover API 渲染选项列表，在 top layer 渲染，
+ * 确保在 `overflow: auto/hidden` 容器内也不会被裁剪。
+ * 支持关键字过滤、键盘导航（↑↓ 移动、Enter 选中、Escape 关闭）。
+ * 打开弹框自动高亮第一项，搜索后也自动高亮第一条结果。
+ */
+class PopoverSelectComponent {
+    trigger = viewChild.required('trigger');
+    popoverEl = viewChild.required('popoverEl');
+    filterInput = viewChild('filterInput', ...(ngDevMode ? [{ debugName: "filterInput" }] : /* istanbul ignore next */ []));
+    uid = `rxdb-ps-${++_uid}`;
+    listId = `${this.uid}-list`;
+    filterText = signal('', ...(ngDevMode ? [{ debugName: "filterText" }] : /* istanbul ignore next */ []));
+    activeIndex = signal(0, ...(ngDevMode ? [{ debugName: "activeIndex" }] : /* istanbul ignore next */ []));
+    options = input.required(...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
+    selected = input('', ...(ngDevMode ? [{ debugName: "selected" }] : /* istanbul ignore next */ []));
+    placeholder = input('请选择', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    minWidth = input('8rem', ...(ngDevMode ? [{ debugName: "minWidth" }] : /* istanbul ignore next */ []));
+    selectChange = output();
+    currentLabel = computed(() => findOptionLabel(this.options(), this.selected(), this.placeholder()), ...(ngDevMode ? [{ debugName: "currentLabel" }] : /* istanbul ignore next */ []));
+    filteredOptions = computed(() => {
+        const filter = this.filterText().toLowerCase().trim();
+        if (!filter)
+            return this.options();
+        return this.options().filter(opt => opt.label.toLowerCase().includes(filter));
+    }, ...(ngDevMode ? [{ debugName: "filteredOptions" }] : /* istanbul ignore next */ []));
+    activeItemId = computed(() => {
+        const idx = this.activeIndex();
+        const opts = this.filteredOptions();
+        return idx >= 0 && idx < opts.length ? `${this.uid}-opt-${opts[idx].value}` : null;
+    }, ...(ngDevMode ? [{ debugName: "activeItemId" }] : /* istanbul ignore next */ []));
+    constructor() {
+        effect(() => {
+            this.filteredOptions();
+            untracked(() => this.activeIndex.set(0));
+        });
+    }
+    onBeforeToggle(event) {
+        const te = event;
+        if (te.newState === 'open') {
+            applyPopoverPosition(this.popoverEl().nativeElement, this.trigger().nativeElement.getBoundingClientRect());
+            this.filterText.set('');
+        }
+    }
+    onToggle(event) {
+        if (event.newState === 'open') {
+            this.filterInput()?.nativeElement.focus();
+            this.activeIndex.set(0);
+        }
+    }
+    onKeydown(event) {
+        const opts = this.filteredOptions();
+        const len = opts.length;
+        switch (event.key) {
+            case 'ArrowDown': {
+                event.preventDefault();
+                if (len > 0) {
+                    this.activeIndex.update(i => (i + 1) % len);
+                    this.scrollActiveIntoView();
+                }
+                break;
+            }
+            case 'ArrowUp': {
+                event.preventDefault();
+                if (len > 0) {
+                    this.activeIndex.update(i => (i - 1 + len) % len);
+                    this.scrollActiveIntoView();
+                }
+                break;
+            }
+            case 'Enter': {
+                event.preventDefault();
+                const opt = opts[this.activeIndex()];
+                if (opt)
+                    this.onSelect(opt.value);
+                break;
+            }
+            case 'Escape': {
+                event.preventDefault();
+                this.popoverEl().nativeElement.hidePopover();
+                this.trigger().nativeElement.focus();
+                break;
+            }
+            case 'Tab': {
+                this.popoverEl().nativeElement.hidePopover();
+                break;
+            }
+        }
+    }
+    onSelect(value) {
+        this.selectChange.emit(value);
+        this.popoverEl().nativeElement.hidePopover();
+        this.trigger().nativeElement.focus();
+    }
+    scrollActiveIntoView() {
+        const opts = this.filteredOptions();
+        const opt = opts[this.activeIndex()];
+        if (!opt)
+            return;
+        document.getElementById(`${this.uid}-opt-${opt.value}`)?.scrollIntoView({ block: 'nearest' });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: PopoverSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: PopoverSelectComponent, isStandalone: true, selector: "rxdb-popover-select", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectChange: "selectChange" }, viewQueries: [{ propertyName: "trigger", first: true, predicate: ["trigger"], descendants: true, isSignal: true }, { propertyName: "popoverEl", first: true, predicate: ["popoverEl"], descendants: true, isSignal: true }, { propertyName: "filterInput", first: true, predicate: ["filterInput"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    <button
+      class="select select-sm text-left"
+      #trigger
+      [attr.popovertarget]="uid"
+      [style.min-width]="minWidth()"
+      type="button"
+    >
+      {{ currentLabel() }}
+    </button>
+    <div
+      class="bg-base-100 rounded-box border-base-300 border shadow-xl"
+      #popoverEl
+      [id]="uid"
+      [style.min-width]="minWidth()"
+      (beforetoggle)="onBeforeToggle($event)"
+      (keydown)="onKeydown($event)"
+      (toggle)="onToggle($event)"
+      popover
+      tabindex="-1"
+    >
+      <div class="mb-1 p-2">
+        <input
+          class="input input-sm w-full"
+          #filterInput
+          [attr.aria-activedescendant]="activeItemId()"
+          [attr.aria-controls]="listId"
+          [attr.aria-expanded]="true"
+          [ngModel]="filterText()"
+          (ngModelChange)="filterText.set($event)"
+          aria-autocomplete="list"
+          placeholder="搜索..."
+          role="combobox"
+          type="text"
+        />
+      </div>
+      <ul class="menu menu-sm max-h-60 w-full flex-nowrap overflow-y-auto px-2" [id]="listId" role="listbox">
+        @for (option of filteredOptions(); track option.value; let i = $index) {
+          <li role="none">
+            <button
+              class="flex w-full items-center text-left text-sm"
+              [attr.aria-selected]="option.value === selected()"
+              [class.bg-primary/15]="option.value === selected()"
+              [class.font-semibold]="option.value === selected()"
+              [class.menu-focus]="activeIndex() === i"
+              [id]="uid + '-opt-' + option.value"
+              (click)="onSelect(option.value)"
+              role="option"
+              type="button"
+            >
+              <span class="grow">{{ option.label }}</span>
+              @if (option.value === selected()) {
+                <svg
+                  class="text-primary h-3 w-3 shrink-0"
+                  fill="none"
+                  stroke="currentColor"
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2.5"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <polyline points="20 6 9 17 4 12" />
+                </svg>
+              }
+            </button>
+          </li>
+        } @empty {
+          <li class="px-3 py-1.5 text-sm opacity-50">无匹配项</li>
+        }
+      </ul>
+    </div>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: PopoverSelectComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'rxdb-popover-select',
+                    standalone: true,
+                    imports: [FormsModule],
+                    template: `
+    <button
+      class="select select-sm text-left"
+      #trigger
+      [attr.popovertarget]="uid"
+      [style.min-width]="minWidth()"
+      type="button"
+    >
+      {{ currentLabel() }}
+    </button>
+    <div
+      class="bg-base-100 rounded-box border-base-300 border shadow-xl"
+      #popoverEl
+      [id]="uid"
+      [style.min-width]="minWidth()"
+      (beforetoggle)="onBeforeToggle($event)"
+      (keydown)="onKeydown($event)"
+      (toggle)="onToggle($event)"
+      popover
+      tabindex="-1"
+    >
+      <div class="mb-1 p-2">
+        <input
+          class="input input-sm w-full"
+          #filterInput
+          [attr.aria-activedescendant]="activeItemId()"
+          [attr.aria-controls]="listId"
+          [attr.aria-expanded]="true"
+          [ngModel]="filterText()"
+          (ngModelChange)="filterText.set($event)"
+          aria-autocomplete="list"
+          placeholder="搜索..."
+          role="combobox"
+          type="text"
+        />
+      </div>
+      <ul class="menu menu-sm max-h-60 w-full flex-nowrap overflow-y-auto px-2" [id]="listId" role="listbox">
+        @for (option of filteredOptions(); track option.value; let i = $index) {
+          <li role="none">
+            <button
+              class="flex w-full items-center text-left text-sm"
+              [attr.aria-selected]="option.value === selected()"
+              [class.bg-primary/15]="option.value === selected()"
+              [class.font-semibold]="option.value === selected()"
+              [class.menu-focus]="activeIndex() === i"
+              [id]="uid + '-opt-' + option.value"
+              (click)="onSelect(option.value)"
+              role="option"
+              type="button"
+            >
+              <span class="grow">{{ option.label }}</span>
+              @if (option.value === selected()) {
+                <svg
+                  class="text-primary h-3 w-3 shrink-0"
+                  fill="none"
+                  stroke="currentColor"
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2.5"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <polyline points="20 6 9 17 4 12" />
+                </svg>
+              }
+            </button>
+          </li>
+        } @empty {
+          <li class="px-3 py-1.5 text-sm opacity-50">无匹配项</li>
+        }
+      </ul>
+    </div>
+  `,
+                    changeDetection: ChangeDetectionStrategy.OnPush
+                }]
+        }], ctorParameters: () => [], propDecorators: { trigger: [{ type: i0.ViewChild, args: ['trigger', { isSignal: true }] }], popoverEl: [{ type: i0.ViewChild, args: ['popoverEl', { isSignal: true }] }], filterInput: [{ type: i0.ViewChild, args: ['filterInput', { isSignal: true }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: true }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], minWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "minWidth", required: false }] }], selectChange: [{ type: i0.Output, args: ["selectChange"] }] } });
+
+/**
+ * 操作符选择器组件
+ *
+ * @description
+ * 基于 {@link PopoverSelectComponent} 提供操作符选择功能，
+ * 自动根据字段类型或元数据筛选可用操作符。
+ * 支持搜索过滤和键盘导航。
+ *
+ * 支持两种使用方式：
+ * 1. 直接模板使用：监听 `(operatorChange)` output 事件
+ * 2. 通过 NgComponentOutlet 注入：传入 `operatorChangeFn` 回调 input
+ */
+class OperatorSelectorComponent {
+    registry = getDefaultOperatorRegistry();
+    operatorOptions = computed(() => {
+        const metadata = this.fieldMetadata();
+        const operators = metadata ? this.registry.getForField(metadata) : this.registry.getForType(this.fieldType());
+        return operators.map(op => ({ value: op.key, label: op.label }));
+    }, ...(ngDevMode ? [{ debugName: "operatorOptions" }] : /* istanbul ignore next */ []));
+    fieldMetadata = input(undefined, ...(ngDevMode ? [{ debugName: "fieldMetadata" }] : /* istanbul ignore next */ []));
+    fieldType = input('string', ...(ngDevMode ? [{ debugName: "fieldType" }] : /* istanbul ignore next */ []));
+    selectedOperator = input('=', ...(ngDevMode ? [{ debugName: "selectedOperator" }] : /* istanbul ignore next */ []));
+    /** 通过 NgComponentOutlet 注入时使用的回调 input */
+    operatorChangeFn = input(undefined, ...(ngDevMode ? [{ debugName: "operatorChangeFn" }] : /* istanbul ignore next */ []));
+    /** 直接模板使用时的 output 事件 */
+    operatorChange = output();
+    onOperatorChange(op) {
+        this.operatorChange.emit(op);
+        this.operatorChangeFn()?.(op);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: OperatorSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: OperatorSelectorComponent, isStandalone: true, selector: "rxdb-operator-selector", inputs: { fieldMetadata: { classPropertyName: "fieldMetadata", publicName: "fieldMetadata", isSignal: true, isRequired: false, transformFunction: null }, fieldType: { classPropertyName: "fieldType", publicName: "fieldType", isSignal: true, isRequired: false, transformFunction: null }, selectedOperator: { classPropertyName: "selectedOperator", publicName: "selectedOperator", isSignal: true, isRequired: false, transformFunction: null }, operatorChangeFn: { classPropertyName: "operatorChangeFn", publicName: "operatorChangeFn", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { operatorChange: "operatorChange" }, ngImport: i0, template: `
+    <rxdb-popover-select
+      [options]="operatorOptions()"
+      [selected]="selectedOperator()"
+      (selectChange)="onOperatorChange($event)"
+      minWidth="8rem"
+      placeholder="选择操作符"
+    />
+  `, isInline: true, dependencies: [{ kind: "component", type: PopoverSelectComponent, selector: "rxdb-popover-select", inputs: ["options", "selected", "placeholder", "minWidth"], outputs: ["selectChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: OperatorSelectorComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'rxdb-operator-selector',
+                    standalone: true,
+                    imports: [PopoverSelectComponent],
+                    template: `
+    <rxdb-popover-select
+      [options]="operatorOptions()"
+      [selected]="selectedOperator()"
+      (selectChange)="onOperatorChange($event)"
+      minWidth="8rem"
+      placeholder="选择操作符"
+    />
+  `,
+                    changeDetection: ChangeDetectionStrategy.OnPush
+                }]
+        }], propDecorators: { fieldMetadata: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldMetadata", required: false }] }], fieldType: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldType", required: false }] }], selectedOperator: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedOperator", required: false }] }], operatorChangeFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "operatorChangeFn", required: false }] }], operatorChange: [{ type: i0.Output, args: ["operatorChange"] }] } });
+
+/**
+ * 值输入组件
+ *
+ * @description
+ * 根据字段类型和操作符显示合适的输入控件：
+ * - string: 文本输入框
+ * - number: 数字输入框
+ * - boolean: 切换开关
+ * - date: 日期选择器
+ * - enum: 下拉选择器
+ * - array: 逗号分隔的文本输入
+ * - range: 范围输入（双输入框或范围选择器）
+ * - null/notNull 操作符: 无输入
+ * - exists/notExists 操作符: 子查询构建器
+ */
+class ValueInputComponent {
+    previousInputType = null;
+    subqueryComponentRef;
+    subquerySubscription;
+    subqueryLoading = false;
+    injector = inject(Injector);
+    /** UUID 格式校验错误（基于 currentValue 派生，inputType 不是 uuid 时自动为空） */
+    uuidError = computed(() => {
+        if (this.inputType() !== 'uuid')
+            return '';
+        const val = String(this.currentValue() ?? '').trim();
+        return val && !UUID_RE.test(val) ? '请输入合法的 UUID 格式' : '';
+    }, ...(ngDevMode ? [{ debugName: "uuidError" }] : /* istanbul ignore next */ []));
+    subqueryContainer;
+    fieldType = input('string', ...(ngDevMode ? [{ debugName: "fieldType" }] : /* istanbul ignore next */ []));
+    operator = input('=', ...(ngDevMode ? [{ debugName: "operator" }] : /* istanbul ignore next */ []));
+    value = input('', ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    enumOptions = input([], ...(ngDevMode ? [{ debugName: "enumOptions" }] : /* istanbul ignore next */ []));
+    relationFields = input([], ...(ngDevMode ? [{ debugName: "relationFields" }] : /* istanbul ignore next */ []));
+    where = input(...(ngDevMode ? [undefined, { debugName: "where" }] : /* istanbul ignore next */ []));
+    valueChange = output();
+    whereChange = output();
+    errorMessage = input('', ...(ngDevMode ? [{ debugName: "errorMessage" }] : /* istanbul ignore next */ []));
+    hasError = computed(() => !!this.errorMessage(), ...(ngDevMode ? [{ debugName: "hasError" }] : /* istanbul ignore next */ []));
+    valueChangeFn = input(undefined, ...(ngDevMode ? [{ debugName: "valueChangeFn" }] : /* istanbul ignore next */ []));
+    whereChangeFn = input(undefined, ...(ngDevMode ? [{ debugName: "whereChangeFn" }] : /* istanbul ignore next */ []));
+    /** 信号状态 —— 替代原先的可变类属性 */
+    currentValue = signal('', ...(ngDevMode ? [{ debugName: "currentValue" }] : /* istanbul ignore next */ []));
+    rangeMin = signal(null, ...(ngDevMode ? [{ debugName: "rangeMin" }] : /* istanbul ignore next */ []));
+    rangeMax = signal(null, ...(ngDevMode ? [{ debugName: "rangeMax" }] : /* istanbul ignore next */ []));
+    arrayInputValue = signal('', ...(ngDevMode ? [{ debugName: "arrayInputValue" }] : /* istanbul ignore next */ []));
+    currentDateStr = signal('', ...(ngDevMode ? [{ debugName: "currentDateStr" }] : /* istanbul ignore next */ []));
+    dateRangeStart = signal('', ...(ngDevMode ? [{ debugName: "dateRangeStart" }] : /* istanbul ignore next */ []));
+    dateRangeEnd = signal('', ...(ngDevMode ? [{ debugName: "dateRangeEnd" }] : /* istanbul ignore next */ []));
+    inputType = computed(() => getInputType(this.fieldType(), this.operator(), this.enumOptions()), ...(ngDevMode ? [{ debugName: "inputType" }] : /* istanbul ignore next */ []));
+    enumSelectOptions = computed(() => this.enumOptions().map(opt => ({ value: String(opt), label: String(opt) })), ...(ngDevMode ? [{ debugName: "enumSelectOptions" }] : /* istanbul ignore next */ []));
+    constructor() {
+        effect(() => {
+            const currentType = this.inputType();
+            if (this.previousInputType !== null && this.previousInputType !== currentType) {
+                const defaultVal = getDefaultValueForType(currentType);
+                this.currentValue.set(defaultVal);
+                this.valueChange.emit(defaultVal);
+                this.valueChangeFn()?.(defaultVal);
+            }
+            this.previousInputType = currentType;
+        });
+        afterNextRender(() => {
+            effect(() => {
+                const isSubquery = this.inputType() === 'subquery';
+                const hasRelationFields = this.relationFields().length > 0;
+                if (isSubquery && hasRelationFields) {
+                    this.loadSubqueryComponent();
+                }
+                else {
+                    this.destroySubqueryComponent();
+                }
+            }, { injector: this.injector });
+        }, { injector: this.injector });
+    }
+    ngOnDestroy() {
+        this.destroySubqueryComponent();
+    }
+    ngOnInit() {
+        const value = this.value();
+        if (this.inputType() === 'range' && Array.isArray(value)) {
+            if (this.fieldType() === 'date') {
+                this.dateRangeStart.set(String(value[0] ?? ''));
+                this.dateRangeEnd.set(String(value[1] ?? ''));
+            }
+            else {
+                this.rangeMin.set(value[0]);
+                this.rangeMax.set(value[1]);
+            }
+        }
+        else if (this.inputType() === 'array' && Array.isArray(value)) {
+            this.arrayInputValue.set(value.join(', '));
+        }
+        else if (this.inputType() === 'enum-array') {
+            this.currentValue.set(Array.isArray(value) ? value : []);
+        }
+        else if (this.inputType() === 'date') {
+            this.currentDateStr.set(typeof value === 'string' ? value : '');
+        }
+        else if (this.inputType() === 'uuid') {
+            this.currentValue.set(typeof value === 'string' ? value : '');
+        }
+        else {
+            this.currentValue.set(this.fieldType() === 'number' && value === '' ? null : value);
+        }
+    }
+    /** 通用值变更（string / boolean…） */
+    onValueChange(value) {
+        this.currentValue.set(value);
+        this.valueChange.emit(value);
+        this.valueChangeFn()?.(value);
+    }
+    /** UUID 值变更（带格式校验） */
+    onUuidChange(value) {
+        this.currentValue.set(value);
+        const trimmed = value.trim();
+        this.valueChange.emit(trimmed.toLowerCase() || '');
+        this.valueChangeFn()?.(trimmed.toLowerCase() || '');
+    }
+    /** 数字输入变更 */
+    onNumberInputChange(value) {
+        const num = value === '' ? null : Number(value);
+        this.currentValue.set(num);
+        this.valueChange.emit(num);
+        this.valueChangeFn()?.(num);
+    }
+    /** 枚举多选变更 */
+    onEnumArrayChange(event) {
+        const select = event.target;
+        const selected = Array.from(select.selectedOptions).map(o => o.value);
+        this.currentValue.set(selected);
+        this.valueChange.emit(selected);
+        this.valueChangeFn()?.(selected);
+    }
+    /** 枚举选项是否选中 */
+    isEnumSelected(opt) {
+        const val = this.currentValue();
+        return Array.isArray(val) && val.includes(opt);
+    }
+    /** 枚举值选中（来自 PopoverSelectComponent） */
+    onEnumSelect(value) {
+        this.currentValue.set(value);
+        this.valueChange.emit(value);
+        this.valueChangeFn()?.(value);
+    }
+    /** 原生日期输入变更 */
+    onNativeDateChange(value) {
+        this.currentDateStr.set(value);
+        this.valueChange.emit(value || '');
+        this.valueChangeFn()?.(value || '');
+    }
+    /** 日期范围起始变更 */
+    onDateRangeStartChange(value) {
+        this.dateRangeStart.set(value);
+        this.onDateRangePartChange();
+    }
+    /** 日期范围结束变更 */
+    onDateRangeEndChange(value) {
+        this.dateRangeEnd.set(value);
+        this.onDateRangePartChange();
+    }
+    onDateRangePartChange() {
+        const start = this.dateRangeStart();
+        const end = this.dateRangeEnd();
+        if (start && end) {
+            this.valueChange.emit([start, end]);
+            this.valueChangeFn()?.([start, end]);
+        }
+        else {
+            this.valueChange.emit([]);
+            this.valueChangeFn()?.([]);
+        }
+    }
+    /** 范围最小值变更 */
+    onRangeMinChange(value) {
+        this.rangeMin.set(value === '' ? null : Number(value));
+        this.onRangeChange();
+    }
+    /** 范围最大值变更 */
+    onRangeMaxChange(value) {
+        this.rangeMax.set(value === '' ? null : Number(value));
+        this.onRangeChange();
+    }
+    onRangeChange() {
+        const min = this.rangeMin();
+        const max = this.rangeMax();
+        if (min != null && max != null) {
+            this.valueChange.emit([min, max]);
+            this.valueChangeFn()?.([min, max]);
+        }
+        else {
+            this.valueChange.emit([]);
+            this.valueChangeFn()?.([]);
+        }
+    }
+    /** 数组输入值变更（逗号分隔字符串） */
+    onArrayInputChange(value) {
+        this.arrayInputValue.set(value);
+        const result = parseCommaSeparatedInput(value, this.fieldType());
+        this.valueChange.emit(result);
+        this.valueChangeFn()?.(result);
+    }
+    handleWhereChange(where) {
+        const typedWhere = where;
+        this.whereChange.emit(typedWhere);
+        this.whereChangeFn()?.(typedWhere);
+    }
+    async loadSubqueryComponent() {
+        if (!this.subqueryContainer || this.subqueryComponentRef || this.subqueryLoading)
+            return;
+        this.subqueryLoading = true;
+        try {
+            const { SubqueryBuilderComponent } = await Promise.resolve().then(function () { return subqueryBuilder_component; });
+            this.subqueryComponentRef = this.subqueryContainer.createComponent(SubqueryBuilderComponent);
+            this.subqueryComponentRef.setInput('fields', this.relationFields());
+            this.subqueryComponentRef.setInput('initialQuery', this.where());
+            this.subquerySubscription = this.subqueryComponentRef.instance.queryChange.subscribe((query) => {
+                this.handleWhereChange(query);
+            });
+        }
+        catch (error) {
+            console.error('[ValueInput] Failed to load SubqueryBuilderComponent:', error);
+        }
+        finally {
+            this.subqueryLoading = false;
+        }
+    }
+    destroySubqueryComponent() {
+        this.subquerySubscription?.unsubscribe();
+        this.subquerySubscription = undefined;
+        if (this.subqueryComponentRef) {
+            this.subqueryComponentRef.destroy();
+            this.subqueryComponentRef = undefined;
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ValueInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ValueInputComponent, isStandalone: true, selector: "rxdb-value-input", inputs: { fieldType: { classPropertyName: "fieldType", publicName: "fieldType", isSignal: true, isRequired: false, transformFunction: null }, operator: { classPropertyName: "operator", publicName: "operator", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, enumOptions: { classPropertyName: "enumOptions", publicName: "enumOptions", isSignal: true, isRequired: false, transformFunction: null }, relationFields: { classPropertyName: "relationFields", publicName: "relationFields", isSignal: true, isRequired: false, transformFunction: null }, where: { classPropertyName: "where", publicName: "where", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, valueChangeFn: { classPropertyName: "valueChangeFn", publicName: "valueChangeFn", isSignal: true, isRequired: false, transformFunction: null }, whereChangeFn: { classPropertyName: "whereChangeFn", publicName: "whereChangeFn", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", whereChange: "whereChange" }, viewQueries: [{ propertyName: "subqueryContainer", first: true, predicate: ["subqueryContainer"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: `
+    @switch (inputType()) {
+      @case ('none') {
+        <span class="text-base-content/50 px-2 text-sm italic">无需输入值</span>
+      }
+      @case ('uuid') {
+        <div
+          [attr.data-tip]="uuidError() || errorMessage() || null"
+          [class.tooltip-top]="!!uuidError() || hasError()"
+          [class.tooltip]="!!uuidError() || hasError()"
+        >
+          <input
+            class="input input-sm font-mono"
+            [class.input-error]="hasError() || !!uuidError()"
+            [value]="currentValue()"
+            (input)="onUuidChange($any($event.target).value)"
+            placeholder="输入 UUID"
+            style="min-width: 16rem"
+            type="text"
+          />
+        </div>
+      }
+      @case ('subquery') {
+        <div class="subquery-container w-full">
+          @if (!relationFields() || relationFields().length === 0) {
+            <span class="text-base-content/50 px-2 text-sm italic">存在/不存在（无子条件）</span>
+          } @else {
+            <div #subqueryContainer></div>
+          }
+        </div>
+      }
+      @case ('boolean') {
+        <input
+          class="toggle toggle-sm"
+          [checked]="!!currentValue()"
+          (change)="onValueChange($any($event.target).checked)"
+          type="checkbox"
+        />
+      }
+      @case ('enum') {
+        <rxdb-popover-select
+          [options]="enumSelectOptions()"
+          [selected]="currentValue()?.toString() ?? ''"
+          (selectChange)="onEnumSelect($event)"
+          minWidth="12rem"
+          placeholder="选择值"
+        />
+      }
+      @case ('enum-array') {
+        <div [attr.data-tip]="errorMessage() || null" [class.tooltip-top]="hasError()" [class.tooltip]="hasError()">
+          <select
+            class="select select-sm"
+            [class.select-error]="hasError()"
+            (change)="onEnumArrayChange($event)"
+            multiple
+            style="min-width: 12rem; min-height: 6rem"
+          >
+            @for (opt of enumOptions(); track opt) {
+              <option [selected]="isEnumSelected(opt)" [value]="opt">{{ opt }}</option>
+            }
+          </select>
+        </div>
+      }
+      @case ('range') {
+        @if (fieldType() === 'date') {
+          <div
+            class="flex items-center gap-2"
+            [attr.data-tip]="errorMessage() || null"
+            [class.tooltip-top]="hasError()"
+            [class.tooltip]="hasError()"
+          >
+            <input
+              class="input input-sm"
+              [class.input-error]="hasError()"
+              [value]="dateRangeStart()"
+              (change)="onDateRangeStartChange($any($event.target).value)"
+              style="width: 9rem"
+              type="date"
+            />
+            <span class="text-base-content/50">至</span>
+            <input
+              class="input input-sm"
+              [class.input-error]="hasError()"
+              [value]="dateRangeEnd()"
+              (change)="onDateRangeEndChange($any($event.target).value)"
+              style="width: 9rem"
+              type="date"
+            />
+          </div>
+        } @else {
+          <div
+            class="flex items-center gap-2"
+            [attr.data-tip]="errorMessage() || null"
+            [class.tooltip-top]="hasError()"
+            [class.tooltip]="hasError()"
+          >
+            <input
+              class="input input-sm"
+              [class.input-error]="hasError()"
+              [value]="rangeMin() ?? ''"
+              (input)="onRangeMinChange($any($event.target).value)"
+              placeholder="最小值"
+              style="width: 7rem"
+              type="number"
+            />
+            <span class="text-base-content/50">至</span>
+            <input
+              class="input input-sm"
+              [class.input-error]="hasError()"
+              [value]="rangeMax() ?? ''"
+              (input)="onRangeMaxChange($any($event.target).value)"
+              placeholder="最大值"
+              style="width: 7rem"
+              type="number"
+            />
+          </div>
+        }
+      }
+      @case ('number') {
+        <div [attr.data-tip]="errorMessage() || null" [class.tooltip-top]="hasError()" [class.tooltip]="hasError()">
+          <input
+            class="input input-sm"
+            [class.input-error]="hasError()"
+            [value]="currentValue() ?? ''"
+            (input)="onNumberInputChange($any($event.target).value)"
+            placeholder="输入数值"
+            type="number"
+          />
+        </div>
+      }
+      @case ('date') {
+        <div [attr.data-tip]="errorMessage() || null" [class.tooltip-top]="hasError()" [class.tooltip]="hasError()">
+          <input
+            class="input input-sm"
+            [class.input-error]="hasError()"
+            [value]="currentDateStr()"
+            (change)="onNativeDateChange($any($event.target).value)"
+            style="width: 10rem"
+            type="date"
+          />
+        </div>
+      }
+      @case ('array') {
+        <div [attr.data-tip]="errorMessage() || null" [class.tooltip-top]="hasError()" [class.tooltip]="hasError()">
+          <input
+            class="input input-sm"
+            [class.input-error]="hasError()"
+            [value]="arrayInputValue()"
+            (input)="onArrayInputChange($any($event.target).value)"
+            placeholder="输入多个值，用逗号分隔"
+            style="width: 100%; min-width: 12rem"
+            type="text"
+          />
+        </div>
+      }
+      @default {
+        <div [attr.data-tip]="errorMessage() || null" [class.tooltip-top]="hasError()" [class.tooltip]="hasError()">
+          <input
+            class="input input-sm"
+            [class.input-error]="hasError()"
+            [value]="currentValue() ?? ''"
+            (input)="onValueChange($any($event.target).value)"
+            placeholder="输入值"
+            style="width: 100%; min-width: 12rem"
+            type="text"
+          />
+        </div>
+      }
+    }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: PopoverSelectComponent, selector: "rxdb-popover-select", inputs: ["options", "selected", "placeholder", "minWidth"], outputs: ["selectChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ValueInputComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'rxdb-value-input',
+                    standalone: true,
+                    imports: [CommonModule, PopoverSelectComponent],
+                    template: `
+    @switch (inputType()) {
+      @case ('none') {
+        <span class="text-base-content/50 px-2 text-sm italic">无需输入值</span>
+      }
+      @case ('uuid') {
+        <div
+          [attr.data-tip]="uuidError() || errorMessage() || null"
+          [class.tooltip-top]="!!uuidError() || hasError()"
+          [class.tooltip]="!!uuidError() || hasError()"
+        >
+          <input
+            class="input input-sm font-mono"
+            [class.input-error]="hasError() || !!uuidError()"
+            [value]="currentValue()"
+            (input)="onUuidChange($any($event.target).value)"
+            placeholder="输入 UUID"
+            style="min-width: 16rem"
+            type="text"
+          />
+        </div>
+      }
+      @case ('subquery') {
+        <div class="subquery-container w-full">
+          @if (!relationFields() || relationFields().length === 0) {
+            <span class="text-base-content/50 px-2 text-sm italic">存在/不存在（无子条件）</span>
+          } @else {
+            <div #subqueryContainer></div>
+          }
+        </div>
+      }
+      @case ('boolean') {
+        <input
+          class="toggle toggle-sm"
+          [checked]="!!currentValue()"
+          (change)="onValueChange($any($event.target).checked)"
+          type="checkbox"
+        />
+      }
+      @case ('enum') {
+        <rxdb-popover-select
+          [options]="enumSelectOptions()"
+          [selected]="currentValue()?.toString() ?? ''"
+          (selectChange)="onEnumSelect($event)"
+          minWidth="12rem"
+          placeholder="选择值"
+        />
+      }
+      @case ('enum-array') {
+        <div [attr.data-tip]="errorMessage() || null" [class.tooltip-top]="hasError()" [class.tooltip]="hasError()">
+          <select
+            class="select select-sm"
+            [class.select-error]="hasError()"
+            (change)="onEnumArrayChange($event)"
+            multiple
+            style="min-width: 12rem; min-height: 6rem"
+          >
+            @for (opt of enumOptions(); track opt) {
+              <option [selected]="isEnumSelected(opt)" [value]="opt">{{ opt }}</option>
+            }
+          </select>
+        </div>
+      }
+      @case ('range') {
+        @if (fieldType() === 'date') {
+          <div
+            class="flex items-center gap-2"
+            [attr.data-tip]="errorMessage() || null"
+            [class.tooltip-top]="hasError()"
+            [class.tooltip]="hasError()"
+          >
+            <input
+              class="input input-sm"
+              [class.input-error]="hasError()"
+              [value]="dateRangeStart()"
+              (change)="onDateRangeStartChange($any($event.target).value)"
+              style="width: 9rem"
+              type="date"
+            />
+            <span class="text-base-content/50">至</span>
+            <input
+              class="input input-sm"
+              [class.input-error]="hasError()"
+              [value]="dateRangeEnd()"
+              (change)="onDateRangeEndChange($any($event.target).value)"
+              style="width: 9rem"
+              type="date"
+            />
+          </div>
+        } @else {
+          <div
+            class="flex items-center gap-2"
+            [attr.data-tip]="errorMessage() || null"
+            [class.tooltip-top]="hasError()"
+            [class.tooltip]="hasError()"
+          >
+            <input
+              class="input input-sm"
+              [class.input-error]="hasError()"
+              [value]="rangeMin() ?? ''"
+              (input)="onRangeMinChange($any($event.target).value)"
+              placeholder="最小值"
+              style="width: 7rem"
+              type="number"
+            />
+            <span class="text-base-content/50">至</span>
+            <input
+              class="input input-sm"
+              [class.input-error]="hasError()"
+              [value]="rangeMax() ?? ''"
+              (input)="onRangeMaxChange($any($event.target).value)"
+              placeholder="最大值"
+              style="width: 7rem"
+              type="number"
+            />
+          </div>
+        }
+      }
+      @case ('number') {
+        <div [attr.data-tip]="errorMessage() || null" [class.tooltip-top]="hasError()" [class.tooltip]="hasError()">
+          <input
+            class="input input-sm"
+            [class.input-error]="hasError()"
+            [value]="currentValue() ?? ''"
+            (input)="onNumberInputChange($any($event.target).value)"
+            placeholder="输入数值"
+            type="number"
+          />
+        </div>
+      }
+      @case ('date') {
+        <div [attr.data-tip]="errorMessage() || null" [class.tooltip-top]="hasError()" [class.tooltip]="hasError()">
+          <input
+            class="input input-sm"
+            [class.input-error]="hasError()"
+            [value]="currentDateStr()"
+            (change)="onNativeDateChange($any($event.target).value)"
+            style="width: 10rem"
+            type="date"
+          />
+        </div>
+      }
+      @case ('array') {
+        <div [attr.data-tip]="errorMessage() || null" [class.tooltip-top]="hasError()" [class.tooltip]="hasError()">
+          <input
+            class="input input-sm"
+            [class.input-error]="hasError()"
+            [value]="arrayInputValue()"
+            (input)="onArrayInputChange($any($event.target).value)"
+            placeholder="输入多个值，用逗号分隔"
+            style="width: 100%; min-width: 12rem"
+            type="text"
+          />
+        </div>
+      }
+      @default {
+        <div [attr.data-tip]="errorMessage() || null" [class.tooltip-top]="hasError()" [class.tooltip]="hasError()">
+          <input
+            class="input input-sm"
+            [class.input-error]="hasError()"
+            [value]="currentValue() ?? ''"
+            (input)="onValueChange($any($event.target).value)"
+            placeholder="输入值"
+            style="width: 100%; min-width: 12rem"
+            type="text"
+          />
+        </div>
+      }
+    }
+  `,
+                    changeDetection: ChangeDetectionStrategy.OnPush
+                }]
+        }], ctorParameters: () => [], propDecorators: { subqueryContainer: [{
+                type: ViewChild,
+                args: ['subqueryContainer', { read: ViewContainerRef }]
+            }], fieldType: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldType", required: false }] }], operator: [{ type: i0.Input, args: [{ isSignal: true, alias: "operator", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], enumOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "enumOptions", required: false }] }], relationFields: [{ type: i0.Input, args: [{ isSignal: true, alias: "relationFields", required: false }] }], where: [{ type: i0.Input, args: [{ isSignal: true, alias: "where", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], whereChange: [{ type: i0.Output, args: ["whereChange"] }], errorMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMessage", required: false }] }], valueChangeFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueChangeFn", required: false }] }], whereChangeFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "whereChangeFn", required: false }] }] } });
+
+/**
+ * 默认主题（原生 HTML 实现）
+ *
+ * @description
+ * 不依赖任何第三方 UI 库，使用标准 HTML 表单元素。
+ * 适合轻量级场景或作为自定义主题的参考实现。
+ *
+ * @example
+ * ```typescript
+ * // 默认主题无需额外配置，开箱即用
+ * imports: [QueryBuilderComponent]
+ * ```
+ */
+const DEFAULT_QUERY_BUILDER_THEME = {
+    fieldSelector: FieldSelectorComponent,
+    operatorSelector: OperatorSelectorComponent,
+    valueInput: ValueInputComponent
+};
+
+/**
+ * QueryBuilder 主题注入 Token
+ *
+ * @example
+ * ```typescript
+ * // 在应用根模块提供自定义主题
+ * providers: [provideQueryBuilderTheme(QUERY_BUILDER_XXX_THEME)]
+ * ```
+ */
+const QUERY_BUILDER_THEME = new InjectionToken('QUERY_BUILDER_THEME');
+/**
+ * 提供自定义主题
+ */
+function provideQueryBuilderTheme(theme) {
+    return { provide: QUERY_BUILDER_THEME, useValue: theme };
+}
+
+/**
+ * 单条查询规则组件
+ *
+ * @description
+ * 显示一条查询规则的编辑界面：
+ * - 字段选择器
+ * - 操作符选择器
+ * - 值输入框
+ * - 删除按钮
+ */
+class QueryRuleComponent {
+    existsOperators = new Set(['exists', 'notExists']);
+    noValueOperators = new Set(['null', 'notNull']);
+    /** 注入的主题（回退到默认主题） */
+    theme = inject(QUERY_BUILDER_THEME, { optional: true }) ?? DEFAULT_QUERY_BUILDER_THEME;
+    rule = input.required(...(ngDevMode ? [{ debugName: "rule" }] : /* istanbul ignore next */ []));
+    fields = input.required(...(ngDevMode ? [{ debugName: "fields" }] : /* istanbul ignore next */ []));
+    errors = input([], ...(ngDevMode ? [{ debugName: "errors" }] : /* istanbul ignore next */ []));
+    update = output();
+    remove = output();
+    fieldAsString = computed(() => this.rule().field, ...(ngDevMode ? [{ debugName: "fieldAsString" }] : /* istanbul ignore next */ []));
+    ruleErrors = computed(() => {
+        const seen = new Set();
+        return this.errors().filter(e => {
+            if (e.field !== this.rule().field)
+                return false;
+            if (seen.has(e.message))
+                return false;
+            seen.add(e.message);
+            return true;
+        });
+    }, ...(ngDevMode ? [{ debugName: "ruleErrors" }] : /* istanbul ignore next */ []));
+    errorTooltip = computed(() => this.ruleErrors()
+        .map(e => e.message)
+        .join(' | '), ...(ngDevMode ? [{ debugName: "errorTooltip" }] : /* istanbul ignore next */ []));
+    isExistsOperator = computed(() => this.existsOperators.has(this.rule().operator), ...(ngDevMode ? [{ debugName: "isExistsOperator" }] : /* istanbul ignore next */ []));
+    isNoValueOperator = computed(() => this.noValueOperators.has(this.rule().operator), ...(ngDevMode ? [{ debugName: "isNoValueOperator" }] : /* istanbul ignore next */ []));
+    /** 子查询面板是否展开（已有 where 规则时自动展开） */
+    showSubquery = signal(false, ...(ngDevMode ? [{ debugName: "showSubquery" }] : /* istanbul ignore next */ []));
+    /**
+     * 当规则的 where 已有内容时自动展开。
+     * 使用 computed 包装监听 rule().where，在显示按钮前检查。
+     */
+    subqueryVisible = computed(() => {
+        const where = this.rule().where;
+        if (where && where.rules && where.rules.length > 0) {
+            return true;
+        }
+        return this.showSubquery();
+    }, ...(ngDevMode ? [{ debugName: "subqueryVisible" }] : /* istanbul ignore next */ []));
+    currentField = computed(() => {
+        const fieldName = this.rule().field;
+        return this.fields().find(f => f.name === fieldName);
+    }, ...(ngDevMode ? [{ debugName: "currentField" }] : /* istanbul ignore next */ []));
+    currentFieldType = computed(() => this.currentField()?.type ?? 'string', ...(ngDevMode ? [{ debugName: "currentFieldType" }] : /* istanbul ignore next */ []));
+    currentEnumOptions = computed(() => this.currentField()?.enum ?? [], ...(ngDevMode ? [{ debugName: "currentEnumOptions" }] : /* istanbul ignore next */ []));
+    /** 当前字段的关系目标实体字段列表 */
+    currentRelationFields = computed(() => {
+        return this.currentField()?.relationFields ?? [];
+    }, ...(ngDevMode ? [{ debugName: "currentRelationFields" }] : /* istanbul ignore next */ []));
+    /** 规则的 where 子查询 */
+    ruleWhere = computed(() => this.rule().where, ...(ngDevMode ? [{ debugName: "ruleWhere" }] : /* istanbul ignore next */ []));
+    /** NgComponentOutlet inputs：字段选择器（fieldChangeCb 是 lazy 引用，声明顺序不影响运行时）*/
+    fieldSelectorInputs = computed(() => ({
+        fields: this.fields(),
+        selectedField: this.fieldAsString(),
+        fieldChangeFn: this.fieldChangeCb
+    }), ...(ngDevMode ? [{ debugName: "fieldSelectorInputs" }] : /* istanbul ignore next */ []));
+    /** NgComponentOutlet inputs：操作符选择器 */
+    operatorSelectorInputs = computed(() => ({
+        fieldMetadata: this.currentField(),
+        fieldType: this.currentFieldType(),
+        selectedOperator: this.rule().operator,
+        operatorChangeFn: this.operatorChangeCb
+    }), ...(ngDevMode ? [{ debugName: "operatorSelectorInputs" }] : /* istanbul ignore next */ []));
+    /** NgComponentOutlet inputs：值输入 */
+    valueInputInputs = computed(() => ({
+        fieldType: this.currentFieldType(),
+        operator: this.rule().operator,
+        value: this.rule().value,
+        enumOptions: this.currentEnumOptions(),
+        relationFields: this.currentRelationFields(),
+        where: this.ruleWhere(),
+        errorMessage: this.errorTooltip(),
+        valueChangeFn: this.valueChangeCb,
+        whereChangeFn: this.whereChangeCb
+    }), ...(ngDevMode ? [{ debugName: "valueInputInputs" }] : /* istanbul ignore next */ []));
+    /** 子条件清空/全部删除时自动收起面板并恢复 +子条件 按钮 */
+    constructor() {
+        effect(() => {
+            const where = this.rule().where;
+            const hasRules = where && where.rules && where.rules.length > 0;
+            if (!hasRules) {
+                untracked(() => this.showSubquery.set(false));
+            }
+        });
+    }
+    // === 公有方法 ===
+    /** 字段变更 */
+    onFieldChange(fieldName) {
+        const field = this.fields().find(f => f.name === fieldName);
+        this.update.emit({
+            id: this.rule().id,
+            updates: {
+                field: fieldName,
+                operator: field?.isRelation ? 'exists'
+                    : field?.type === 'keyValue' ? 'null'
+                        : '=',
+                value: field?.type === 'boolean' ? false : '',
+                where: undefined // 重置子查询
+            }
+        });
+    }
+    /** 添加子条件：展开面板并创建一条默认子规则 */
+    onAddSubcondition() {
+        this.showSubquery.set(true);
+        const relationFields = this.currentRelationFields();
+        const firstField = relationFields[0];
+        if (firstField) {
+            const where = {
+                id: '',
+                combinator: 'and',
+                rules: [
+                    {
+                        id: '',
+                        field: firstField.name,
+                        operator: firstField.isRelation ? 'exists'
+                            : firstField.type === 'keyValue' ? 'null'
+                                : '=',
+                        value: firstField.type === 'boolean' ? false : ''
+                    }
+                ]
+            };
+            this.update.emit({ id: this.rule().id, updates: { where } });
+        }
+    }
+    /** 操作符变更 */
+    onOperatorChange(operator) {
+        const updates = { operator };
+        if (this.existsOperators.has(operator) || this.noValueOperators.has(operator)) {
+            updates.value = null;
+        }
+        if (!this.existsOperators.has(operator)) {
+            updates.where = undefined;
+            this.showSubquery.set(false);
+        }
+        this.update.emit({ id: this.rule().id, updates });
+    }
+    /** 值变更 */
+    onValueChange(value) {
+        this.update.emit({
+            id: this.rule().id,
+            updates: { value }
+        });
+    }
+    /** 子查询条件变更 */
+    onWhereChange(where) {
+        this.update.emit({
+            id: this.rule().id,
+            updates: { where }
+        });
+    }
+    /** 删除规则 */
+    onRemove() {
+        this.remove.emit();
+    }
+    // === 私有 callback 字段（computed signal 是懒求值的，this.onXxx 在调用时已初始化）===
+    fieldChangeCb = (field) => this.onFieldChange(field);
+    operatorChangeCb = (op) => this.onOperatorChange(op);
+    valueChangeCb = (value) => this.onValueChange(value);
+    whereChangeCb = (where) => this.onWhereChange(where);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: QueryRuleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: QueryRuleComponent, isStandalone: true, selector: "rxdb-query-rule", inputs: { rule: { classPropertyName: "rule", publicName: "rule", isSignal: true, isRequired: true, transformFunction: null }, fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { update: "update", remove: "remove" }, ngImport: i0, template: `
+    <div class="rxdb-query-rule group flex flex-col rounded p-1">
+      <div class="flex flex-wrap items-center gap-2">
+        <ng-container [ngComponentOutlet]="theme.fieldSelector" [ngComponentOutletInputs]="fieldSelectorInputs()" />
+        <ng-container
+          [ngComponentOutlet]="theme.operatorSelector"
+          [ngComponentOutletInputs]="operatorSelectorInputs()"
+        />
+        @if (isExistsOperator()) {
+          @if (!subqueryVisible()) {
+            <button class="btn btn-ghost btn-xs" (click)="onAddSubcondition()" title="添加子条件" type="button">
+              + 子条件（可选）
+            </button>
+          }
+        } @else if (!isNoValueOperator()) {
+          <ng-container [ngComponentOutlet]="theme.valueInput" [ngComponentOutletInputs]="valueInputInputs()" />
+        }
+        <button
+          class="btn btn-ghost btn-xs btn-square text-base-content/30 hover:text-error ml-auto"
+          (click)="onRemove()"
+          title="删除条件"
+          type="button"
+        >
+          ✕
+        </button>
+      </div>
+      @if (isExistsOperator() && subqueryVisible()) {
+        <ng-container [ngComponentOutlet]="theme.valueInput" [ngComponentOutletInputs]="valueInputInputs()" />
+      }
+    </div>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: QueryRuleComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'rxdb-query-rule',
+                    standalone: true,
+                    imports: [CommonModule, NgComponentOutlet],
+                    template: `
+    <div class="rxdb-query-rule group flex flex-col rounded p-1">
+      <div class="flex flex-wrap items-center gap-2">
+        <ng-container [ngComponentOutlet]="theme.fieldSelector" [ngComponentOutletInputs]="fieldSelectorInputs()" />
+        <ng-container
+          [ngComponentOutlet]="theme.operatorSelector"
+          [ngComponentOutletInputs]="operatorSelectorInputs()"
+        />
+        @if (isExistsOperator()) {
+          @if (!subqueryVisible()) {
+            <button class="btn btn-ghost btn-xs" (click)="onAddSubcondition()" title="添加子条件" type="button">
+              + 子条件（可选）
+            </button>
+          }
+        } @else if (!isNoValueOperator()) {
+          <ng-container [ngComponentOutlet]="theme.valueInput" [ngComponentOutletInputs]="valueInputInputs()" />
+        }
+        <button
+          class="btn btn-ghost btn-xs btn-square text-base-content/30 hover:text-error ml-auto"
+          (click)="onRemove()"
+          title="删除条件"
+          type="button"
+        >
+          ✕
+        </button>
+      </div>
+      @if (isExistsOperator() && subqueryVisible()) {
+        <ng-container [ngComponentOutlet]="theme.valueInput" [ngComponentOutletInputs]="valueInputInputs()" />
+      }
+    </div>
+  `,
+                    changeDetection: ChangeDetectionStrategy.OnPush
+                }]
+        }], ctorParameters: () => [], propDecorators: { rule: [{ type: i0.Input, args: [{ isSignal: true, alias: "rule", required: true }] }], fields: [{ type: i0.Input, args: [{ isSignal: true, alias: "fields", required: true }] }], errors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }], update: [{ type: i0.Output, args: ["update"] }], remove: [{ type: i0.Output, args: ["remove"] }] } });
+
+class QueryDragDropHandler {
+    moveItemFn;
+    state = signal({
+        draggedItemId: null,
+        targetItemId: null,
+        dropMode: null,
+        isValidTarget: false
+    }, ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
+    constructor(moveItemFn) {
+        this.moveItemFn = moveItemFn;
+    }
+    start(itemId) {
+        this.state.set({ draggedItemId: itemId, targetItemId: null, dropMode: null, isValidTarget: false });
+    }
+    over(targetItemId, dropMode, isValid, depth) {
+        this.state.update(current => {
+            if (current.depth !== undefined && depth < current.depth)
+                return current;
+            return { ...current, targetItemId, dropMode, isValidTarget: isValid, depth };
+        });
+    }
+    leave() {
+        this.state.update(s => ({ ...s, targetItemId: null, dropMode: null, isValidTarget: false, depth: undefined }));
+    }
+    drop(itemId, targetGroupId, targetIndex) {
+        try {
+            this.moveItemFn(itemId, targetGroupId, targetIndex);
+        }
+        catch {
+            // 服务层拒绝（如循环嵌套），静默忽略
+        }
+        this.reset();
+    }
+    end() {
+        this.reset();
+    }
+    reset() {
+        this.state.set({ draggedItemId: null, targetItemId: null, dropMode: null, isValidTarget: false });
+    }
+}
+function calculateDropMode(clientY, rect, isGroup) {
+    const ratio = (clientY - rect.top) / rect.height;
+    if (isGroup) {
+        if (ratio < 0.25)
+            return 'before';
+        if (ratio > 0.75)
+            return 'after';
+        return 'into';
+    }
+    return ratio < 0.5 ? 'before' : 'after';
+}
+/**
+ * 查询规则组组件（递归）
+ *
+ * @description
+ * 显示一组查询规则，支持：
+ * - AND/OR 切换（Teable 风格：行内 conjunction 前缀）
+ * - 添加规则/子组
+ * - 删除组
+ * - 递归嵌套显示
+ */
+class QueryGroupComponent {
+    group = input.required(...(ngDevMode ? [{ debugName: "group" }] : /* istanbul ignore next */ []));
+    fields = input.required(...(ngDevMode ? [{ debugName: "fields" }] : /* istanbul ignore next */ []));
+    errors = input([], ...(ngDevMode ? [{ debugName: "errors" }] : /* istanbul ignore next */ []));
+    depth = input(0, ...(ngDevMode ? [{ debugName: "depth" }] : /* istanbul ignore next */ []));
+    maxDepth = input(5, ...(ngDevMode ? [{ debugName: "maxDepth" }] : /* istanbul ignore next */ []));
+    dragDropHandler = input(...(ngDevMode ? [undefined, { debugName: "dragDropHandler" }] : /* istanbul ignore next */ []));
+    /** 是否允许展开/收起组（默认开启） */
+    allowCollapse = input(true, ...(ngDevMode ? [{ debugName: "allowCollapse" }] : /* istanbul ignore next */ []));
+    addRule = output();
+    addGroup = output();
+    removeItem = output();
+    updateRule = output();
+    updateCombinator = output();
+    /** 当前组是否已折叠 */
+    collapsed = signal(false, ...(ngDevMode ? [{ debugName: "collapsed" }] : /* istanbul ignore next */ []));
+    /** 是否可以添加子组（未达到最大深度） */
+    canAddGroup = computed(() => this.depth() < this.maxDepth() - 1, ...(ngDevMode ? [{ debugName: "canAddGroup" }] : /* istanbul ignore next */ []));
+    /** 切换折叠状态 */
+    toggleCollapse() {
+        this.collapsed.update(v => !v);
+    }
+    /** 切换组合器 */
+    toggleCombinator(combinator) {
+        if (this.group().combinator !== combinator) {
+            this.updateCombinator.emit({ id: this.group().id, combinator });
+        }
+    }
+    /** 添加规则 */
+    onAddRule() {
+        const firstField = this.fields()[0];
+        if (firstField) {
+            this.addRule.emit({
+                parentId: this.group().id,
+                rule: {
+                    field: firstField.name,
+                    operator: firstField.isRelation ? 'exists'
+                        : firstField.type === 'keyValue' ? 'null'
+                            : '=',
+                    value: firstField.type === 'boolean' ? false : ''
+                }
+            });
+        }
+    }
+    /** 添加子组 */
+    onAddGroup() {
+        this.addGroup.emit(this.group().id);
+    }
+    /** 删除此组 */
+    onRemove() {
+        this.removeItem.emit(this.group().id);
+    }
+    /** 规则更新 */
+    onRuleUpdate(event) {
+        this.updateRule.emit(event);
+    }
+    /** 删除规则 */
+    onRuleRemove(id) {
+        this.removeItem.emit(id);
+    }
+    /** 类型守卫：是否为规则组 */
+    isRuleGroup(item) {
+        return 'combinator' in item && 'rules' in item;
+    }
+    /** 类型转换：转为规则组 */
+    asRuleGroup(item) {
+        return item;
+    }
+    /** 类型转换：转为规则 */
+    asRule(item) {
+        return item;
+    }
+    /** 追踪函数 */
+    trackByItem(item) {
+        return item.id;
+    }
+    isDragging(itemId) {
+        return this.dragDropHandler()?.state().draggedItemId === itemId;
+    }
+    isDropTarget(itemId, mode) {
+        const state = this.dragDropHandler()?.state();
+        return !!state && state.targetItemId === itemId && state.dropMode === mode && state.isValidTarget;
+    }
+    isDropInvalid(itemId) {
+        const state = this.dragDropHandler()?.state();
+        return !!state && state.targetItemId === itemId && !state.isValidTarget && !!state.draggedItemId;
+    }
+    onItemDragStart(event, item) {
+        const handler = this.dragDropHandler();
+        if (!handler || !event.dataTransfer)
+            return;
+        event.stopPropagation();
+        event.dataTransfer.effectAllowed = 'move';
+        event.dataTransfer.setData('text/plain', item.id);
+        const row = event.target.closest('.rxdb-drag-item');
+        if (row) {
+            const rect = row.getBoundingClientRect();
+            event.dataTransfer.setDragImage(row, event.clientX - rect.left, event.clientY - rect.top);
+        }
+        handler.start(item.id);
+    }
+    onItemDragOver(event, item, index, isGroup) {
+        event.preventDefault();
+        event.stopPropagation();
+        const handler = this.dragDropHandler();
+        if (!handler || !event.dataTransfer)
+            return;
+        const rect = event.currentTarget.getBoundingClientRect();
+        const dropMode = calculateDropMode(event.clientY, rect, isGroup);
+        const draggedId = handler.state().draggedItemId;
+        const isValid = !!draggedId && draggedId !== item.id && (dropMode !== 'into' || isGroup);
+        event.dataTransfer.dropEffect = isValid ? 'move' : 'none';
+        handler.over(item.id, dropMode, isValid, this.depth());
+    }
+    onItemDragLeave(event) {
+        const target = event.currentTarget;
+        const related = event.relatedTarget;
+        if (!related || !target.contains(related)) {
+            this.dragDropHandler()?.leave();
+        }
+    }
+    onItemDrop(event, targetItem, targetIndex, isGroup) {
+        event.preventDefault();
+        event.stopPropagation();
+        const handler = this.dragDropHandler();
+        const state = handler?.state();
+        if (!handler || !state?.draggedItemId || !state.isValidTarget || !state.dropMode) {
+            handler?.end();
+            return;
+        }
+        const dropMode = state.dropMode;
+        let finalTargetGroupId;
+        let finalTargetIndex;
+        if (dropMode === 'into' && isGroup) {
+            const subGroup = targetItem;
+            finalTargetGroupId = subGroup.id;
+            const draggedInTarget = subGroup.rules.some(r => r.id === state.draggedItemId);
+            finalTargetIndex = draggedInTarget ? subGroup.rules.length - 1 : subGroup.rules.length;
+        }
+        else {
+            finalTargetGroupId = this.group().id;
+            const rules = this.group().rules;
+            const draggedIndex = rules.findIndex(r => r.id === state.draggedItemId);
+            const isInSameGroup = draggedIndex !== -1;
+            let adjustedIndex = targetIndex;
+            if (isInSameGroup && draggedIndex < targetIndex) {
+                adjustedIndex--;
+            }
+            finalTargetIndex = dropMode === 'before' ? adjustedIndex : adjustedIndex + 1;
+        }
+        handler.drop(state.draggedItemId, finalTargetGroupId, finalTargetIndex);
+    }
+    onItemDragEnd() {
+        this.dragDropHandler()?.end();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: QueryGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: QueryGroupComponent, isStandalone: true, selector: "rxdb-query-group", inputs: { group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: true, transformFunction: null }, fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null }, depth: { classPropertyName: "depth", publicName: "depth", isSignal: true, isRequired: false, transformFunction: null }, maxDepth: { classPropertyName: "maxDepth", publicName: "maxDepth", isSignal: true, isRequired: false, transformFunction: null }, dragDropHandler: { classPropertyName: "dragDropHandler", publicName: "dragDropHandler", isSignal: true, isRequired: false, transformFunction: null }, allowCollapse: { classPropertyName: "allowCollapse", publicName: "allowCollapse", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { addRule: "addRule", addGroup: "addGroup", removeItem: "removeItem", updateRule: "updateRule", updateCombinator: "updateCombinator" }, ngImport: i0, template: `
+    <div class="rxdb-query-group border-base-300 my-1 rounded-lg border p-2" [class.bg-base-200]="depth() % 2 === 1">
+      <!-- 组合器 + 操作按钮（同一行） -->
+      <div class="flex items-center gap-2" [class.mb-2]="!collapsed()">
+        <div class="join">
+          <button
+            class="btn btn-xs join-item"
+            [class.btn-ghost]="group().combinator !== 'and'"
+            [class.btn-primary]="group().combinator === 'and'"
+            (click)="toggleCombinator('and')"
+            type="button"
+          >
+            AND
+          </button>
+          <button
+            class="btn btn-xs join-item"
+            [class.btn-ghost]="group().combinator !== 'or'"
+            [class.btn-primary]="group().combinator === 'or'"
+            (click)="toggleCombinator('or')"
+            type="button"
+          >
+            OR
+          </button>
+        </div>
+
+        @if (allowCollapse()) {
+          <button
+            class="btn btn-ghost btn-xs btn-square"
+            [title]="collapsed() ? '展开' : '收起'"
+            (click)="toggleCollapse()"
+            type="button"
+          >
+            <svg
+              class="h-3 w-3 transition-transform duration-200"
+              [class.-rotate-90]="collapsed()"
+              fill="none"
+              stroke="currentColor"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              stroke-width="2.5"
+              viewBox="0 0 24 24"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <polyline points="6 9 12 15 18 9" />
+            </svg>
+          </button>
+        }
+
+        <div class="flex-1"></div>
+
+        @if (!collapsed()) {
+          <button class="btn btn-ghost btn-xs" (click)="onAddRule()" type="button">+ 条件</button>
+
+          @if (canAddGroup()) {
+            <button class="btn btn-ghost btn-xs" (click)="onAddGroup()" type="button">+ 分组</button>
+          }
+
+          @if (depth() > 0) {
+            <button
+              class="btn btn-ghost btn-xs btn-square text-base-content/40 hover:text-error"
+              (click)="onRemove()"
+              title="删除组"
+              type="button"
+            >
+              ✕
+            </button>
+          }
+        }
+      </div>
+
+      <!-- 规则列表 -->
+      @if (!collapsed()) {
+        <div class="space-y-1">
+          @for (item of group().rules; track trackByItem(item); let idx = $index) {
+            @if (isRuleGroup(item)) {
+              <div
+                class="rxdb-drag-item"
+                [class.dragging]="isDragging(item.id)"
+                [class.drop-invalid]="isDropInvalid(item.id)"
+                [class.drop-target-after]="isDropTarget(item.id, 'after')"
+                [class.drop-target-before]="isDropTarget(item.id, 'before')"
+                [class.drop-target-into]="isDropTarget(item.id, 'into')"
+                (dragend)="onItemDragEnd()"
+                (dragleave)="onItemDragLeave($event)"
+                (dragover)="onItemDragOver($event, item, idx, true)"
+                (drop)="onItemDrop($event, item, idx, true)"
+              >
+                <div class="flex items-start gap-1">
+                  @if (dragDropHandler()) {
+                    <span
+                      class="btn btn-ghost btn-xs btn-square text-base-content/30 hover:text-base-content/60 mt-1 cursor-grab"
+                      (dragstart)="onItemDragStart($event, item)"
+                      draggable="true"
+                      >⠿</span
+                    >
+                  }
+                  <div class="min-w-0 flex-1">
+                    <rxdb-query-group
+                      [allowCollapse]="allowCollapse()"
+                      [depth]="depth() + 1"
+                      [dragDropHandler]="dragDropHandler()"
+                      [errors]="errors()"
+                      [fields]="fields()"
+                      [group]="asRuleGroup(item)"
+                      [maxDepth]="maxDepth()"
+                      (addGroup)="addGroup.emit($event)"
+                      (addRule)="addRule.emit($event)"
+                      (removeItem)="removeItem.emit($event)"
+                      (updateCombinator)="updateCombinator.emit($event)"
+                      (updateRule)="updateRule.emit($event)"
+                    />
+                  </div>
+                </div>
+              </div>
+            } @else {
+              <div
+                class="rxdb-drag-item"
+                [class.dragging]="isDragging(item.id)"
+                [class.drop-invalid]="isDropInvalid(item.id)"
+                [class.drop-target-after]="isDropTarget(item.id, 'after')"
+                [class.drop-target-before]="isDropTarget(item.id, 'before')"
+                (dragend)="onItemDragEnd()"
+                (dragleave)="onItemDragLeave($event)"
+                (dragover)="onItemDragOver($event, item, idx, false)"
+                (drop)="onItemDrop($event, item, idx, false)"
+              >
+                <div class="flex items-center gap-1">
+                  @if (dragDropHandler()) {
+                    <span
+                      class="btn btn-ghost btn-xs btn-square text-base-content/30 hover:text-base-content/60 cursor-grab"
+                      (dragstart)="onItemDragStart($event, item)"
+                      draggable="true"
+                      >⠿</span
+                    >
+                  }
+                  <div class="min-w-0 flex-1">
+                    <rxdb-query-rule
+                      [errors]="errors()"
+                      [fields]="fields()"
+                      [rule]="asRule(item)"
+                      (remove)="onRuleRemove(asRule(item).id)"
+                      (update)="onRuleUpdate($event)"
+                    />
+                  </div>
+                </div>
+              </div>
+            }
+          }
+        </div>
+
+        <!-- 空状态 -->
+        @if (group().rules.length === 0) {
+          <div class="text-base-content/50 py-2 text-center text-sm select-none">暂无条件</div>
+        }
+      }
+    </div>
+  `, isInline: true, styles: [".rxdb-drag-item{position:relative}.rxdb-drag-item.dragging{opacity:.4}.rxdb-drag-item.drop-target-before:before{content:\"\";position:absolute;top:-2px;left:0;right:0;height:3px;background:#0083e0;background:oklch(.6 .2 250);border-radius:2px;z-index:1}.rxdb-drag-item.drop-target-after:after{content:\"\";position:absolute;bottom:-2px;left:0;right:0;height:3px;background:#0083e0;background:oklch(.6 .2 250);border-radius:2px;z-index:1}.rxdb-drag-item.drop-target-into{outline:2px dashed oklch(.6 .2 250);outline-offset:-2px;border-radius:.5rem;background:#0083e01a;background:oklch(.6 .2 250 / 10%)}.rxdb-drag-item.drop-invalid{outline:2px dashed oklch(.6 .2 30);outline-offset:-2px;border-radius:.5rem}\n"], dependencies: [{ kind: "component", type: QueryGroupComponent, selector: "rxdb-query-group", inputs: ["group", "fields", "errors", "depth", "maxDepth", "dragDropHandler", "allowCollapse"], outputs: ["addRule", "addGroup", "removeItem", "updateRule", "updateCombinator"] }, { kind: "ngmodule", type: CommonModule }, { kind: "component", type: QueryRuleComponent, selector: "rxdb-query-rule", inputs: ["rule", "fields", "errors"], outputs: ["update", "remove"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: QueryGroupComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rxdb-query-group', standalone: true, imports: [CommonModule, QueryRuleComponent], template: `
+    <div class="rxdb-query-group border-base-300 my-1 rounded-lg border p-2" [class.bg-base-200]="depth() % 2 === 1">
+      <!-- 组合器 + 操作按钮（同一行） -->
+      <div class="flex items-center gap-2" [class.mb-2]="!collapsed()">
+        <div class="join">
+          <button
+            class="btn btn-xs join-item"
+            [class.btn-ghost]="group().combinator !== 'and'"
+            [class.btn-primary]="group().combinator === 'and'"
+            (click)="toggleCombinator('and')"
+            type="button"
+          >
+            AND
+          </button>
+          <button
+            class="btn btn-xs join-item"
+            [class.btn-ghost]="group().combinator !== 'or'"
+            [class.btn-primary]="group().combinator === 'or'"
+            (click)="toggleCombinator('or')"
+            type="button"
+          >
+            OR
+          </button>
+        </div>
+
+        @if (allowCollapse()) {
+          <button
+            class="btn btn-ghost btn-xs btn-square"
+            [title]="collapsed() ? '展开' : '收起'"
+            (click)="toggleCollapse()"
+            type="button"
+          >
+            <svg
+              class="h-3 w-3 transition-transform duration-200"
+              [class.-rotate-90]="collapsed()"
+              fill="none"
+              stroke="currentColor"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              stroke-width="2.5"
+              viewBox="0 0 24 24"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <polyline points="6 9 12 15 18 9" />
+            </svg>
+          </button>
+        }
+
+        <div class="flex-1"></div>
+
+        @if (!collapsed()) {
+          <button class="btn btn-ghost btn-xs" (click)="onAddRule()" type="button">+ 条件</button>
+
+          @if (canAddGroup()) {
+            <button class="btn btn-ghost btn-xs" (click)="onAddGroup()" type="button">+ 分组</button>
+          }
+
+          @if (depth() > 0) {
+            <button
+              class="btn btn-ghost btn-xs btn-square text-base-content/40 hover:text-error"
+              (click)="onRemove()"
+              title="删除组"
+              type="button"
+            >
+              ✕
+            </button>
+          }
+        }
+      </div>
+
+      <!-- 规则列表 -->
+      @if (!collapsed()) {
+        <div class="space-y-1">
+          @for (item of group().rules; track trackByItem(item); let idx = $index) {
+            @if (isRuleGroup(item)) {
+              <div
+                class="rxdb-drag-item"
+                [class.dragging]="isDragging(item.id)"
+                [class.drop-invalid]="isDropInvalid(item.id)"
+                [class.drop-target-after]="isDropTarget(item.id, 'after')"
+                [class.drop-target-before]="isDropTarget(item.id, 'before')"
+                [class.drop-target-into]="isDropTarget(item.id, 'into')"
+                (dragend)="onItemDragEnd()"
+                (dragleave)="onItemDragLeave($event)"
+                (dragover)="onItemDragOver($event, item, idx, true)"
+                (drop)="onItemDrop($event, item, idx, true)"
+              >
+                <div class="flex items-start gap-1">
+                  @if (dragDropHandler()) {
+                    <span
+                      class="btn btn-ghost btn-xs btn-square text-base-content/30 hover:text-base-content/60 mt-1 cursor-grab"
+                      (dragstart)="onItemDragStart($event, item)"
+                      draggable="true"
+                      >⠿</span
+                    >
+                  }
+                  <div class="min-w-0 flex-1">
+                    <rxdb-query-group
+                      [allowCollapse]="allowCollapse()"
+                      [depth]="depth() + 1"
+                      [dragDropHandler]="dragDropHandler()"
+                      [errors]="errors()"
+                      [fields]="fields()"
+                      [group]="asRuleGroup(item)"
+                      [maxDepth]="maxDepth()"
+                      (addGroup)="addGroup.emit($event)"
+                      (addRule)="addRule.emit($event)"
+                      (removeItem)="removeItem.emit($event)"
+                      (updateCombinator)="updateCombinator.emit($event)"
+                      (updateRule)="updateRule.emit($event)"
+                    />
+                  </div>
+                </div>
+              </div>
+            } @else {
+              <div
+                class="rxdb-drag-item"
+                [class.dragging]="isDragging(item.id)"
+                [class.drop-invalid]="isDropInvalid(item.id)"
+                [class.drop-target-after]="isDropTarget(item.id, 'after')"
+                [class.drop-target-before]="isDropTarget(item.id, 'before')"
+                (dragend)="onItemDragEnd()"
+                (dragleave)="onItemDragLeave($event)"
+                (dragover)="onItemDragOver($event, item, idx, false)"
+                (drop)="onItemDrop($event, item, idx, false)"
+              >
+                <div class="flex items-center gap-1">
+                  @if (dragDropHandler()) {
+                    <span
+                      class="btn btn-ghost btn-xs btn-square text-base-content/30 hover:text-base-content/60 cursor-grab"
+                      (dragstart)="onItemDragStart($event, item)"
+                      draggable="true"
+                      >⠿</span
+                    >
+                  }
+                  <div class="min-w-0 flex-1">
+                    <rxdb-query-rule
+                      [errors]="errors()"
+                      [fields]="fields()"
+                      [rule]="asRule(item)"
+                      (remove)="onRuleRemove(asRule(item).id)"
+                      (update)="onRuleUpdate($event)"
+                    />
+                  </div>
+                </div>
+              </div>
+            }
+          }
+        </div>
+
+        <!-- 空状态 -->
+        @if (group().rules.length === 0) {
+          <div class="text-base-content/50 py-2 text-center text-sm select-none">暂无条件</div>
+        }
+      }
+    </div>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".rxdb-drag-item{position:relative}.rxdb-drag-item.dragging{opacity:.4}.rxdb-drag-item.drop-target-before:before{content:\"\";position:absolute;top:-2px;left:0;right:0;height:3px;background:#0083e0;background:oklch(.6 .2 250);border-radius:2px;z-index:1}.rxdb-drag-item.drop-target-after:after{content:\"\";position:absolute;bottom:-2px;left:0;right:0;height:3px;background:#0083e0;background:oklch(.6 .2 250);border-radius:2px;z-index:1}.rxdb-drag-item.drop-target-into{outline:2px dashed oklch(.6 .2 250);outline-offset:-2px;border-radius:.5rem;background:#0083e01a;background:oklch(.6 .2 250 / 10%)}.rxdb-drag-item.drop-invalid{outline:2px dashed oklch(.6 .2 30);outline-offset:-2px;border-radius:.5rem}\n"] }]
+        }], propDecorators: { group: [{ type: i0.Input, args: [{ isSignal: true, alias: "group", required: true }] }], fields: [{ type: i0.Input, args: [{ isSignal: true, alias: "fields", required: true }] }], errors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }], depth: [{ type: i0.Input, args: [{ isSignal: true, alias: "depth", required: false }] }], maxDepth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxDepth", required: false }] }], dragDropHandler: [{ type: i0.Input, args: [{ isSignal: true, alias: "dragDropHandler", required: false }] }], allowCollapse: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowCollapse", required: false }] }], addRule: [{ type: i0.Output, args: ["addRule"] }], addGroup: [{ type: i0.Output, args: ["addGroup"] }], removeItem: [{ type: i0.Output, args: ["removeItem"] }], updateRule: [{ type: i0.Output, args: ["updateRule"] }], updateCombinator: [{ type: i0.Output, args: ["updateCombinator"] }] } });
+
+/**
+ * Angular Query Builder 主组件
+ *
+ * @description
+ * 提供可视化的查询条件构建界面，支持：
+ * - 传入 SchemaInfo 或 FieldMetadata[] 定义可用字段
+ * - 拖拽重排规则和分组
+ * - 嵌套分组（最大 5 层）
+ * - 实时验证
+ *
+ * @example
+ * ```html
+ * <rxdb-query-builder
+ *   [schema]="schema"
+ *   (queryChange)="onQueryChange($event)"
+ * />
+ * ```
+ */
+class QueryBuilderComponent {
+    service;
+    /** 上次应用的 initialQuery 引用，用于检测是否有新查询需要加载 */
+    lastAppliedInitialQuery = undefined;
+    scrollContainer = viewChild('scrollContainer', ...(ngDevMode ? [{ debugName: "scrollContainer" }] : /* istanbul ignore next */ []));
+    /** 根规则组 Signal */
+    rootGroupSignal;
+    /** 验证 Signal */
+    validationSignal;
+    /**
+     * Schema 信息，包含字段定义
+     */
+    schema = input(...(ngDevMode ? [undefined, { debugName: "schema" }] : /* istanbul ignore next */ []));
+    /**
+     * 字段列表（直接传入，优先于 schema）
+     */
+    fields = input([], ...(ngDevMode ? [{ debugName: "fields" }] : /* istanbul ignore next */ []));
+    /**
+     * 初始查询条件（可选）
+     */
+    initialQuery = input(...(ngDevMode ? [undefined, { debugName: "initialQuery" }] : /* istanbul ignore next */ []));
+    /**
+     * 最大嵌套层级（默认 5）
+     */
+    maxDepth = input(5, ...(ngDevMode ? [{ debugName: "maxDepth" }] : /* istanbul ignore next */ []));
+    /**
+     * 内容区域最大高度（超出后滚动），支持任意 CSS 长度值，如 `'400px'`、`'50vh'`
+     */
+    height = input('80vh', ...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
+    /**
+     * 是否开启拖拽排序功能（默认开启）
+     */
+    enableDrag = input(true, ...(ngDevMode ? [{ debugName: "enableDrag" }] : /* istanbul ignore next */ []));
+    /**
+     * 是否开启分组展开/收起功能（默认开启）
+     */
+    enableCollapse = input(true, ...(ngDevMode ? [{ debugName: "enableCollapse" }] : /* istanbul ignore next */ []));
+    dragDropHandler;
+    /**
+     * 查询条件变更事件
+     */
+    queryChange = output();
+    /**
+     * 验证状态变更事件
+     */
+    validationChange = output();
+    /** 计算后的字段列表 */
+    fieldsComputed = computed(() => {
+        // 优先使用直接传入的 fields
+        const directFields = this.fields();
+        if (directFields && directFields.length > 0) {
+            return directFields;
+        }
+        // 否则从 schema 获取
+        const schemaInfo = this.schema();
+        return schemaInfo?.fields ?? [];
+    }, ...(ngDevMode ? [{ debugName: "fieldsComputed" }] : /* istanbul ignore next */ []));
+    /** 根规则组 */
+    rootGroup = computed(() => {
+        return this.rootGroupSignal();
+    }, ...(ngDevMode ? [{ debugName: "rootGroup" }] : /* istanbul ignore next */ []));
+    /** 验证错误列表 */
+    validationErrors = computed(() => {
+        const validation = this.validationSignal();
+        return validation?.errors ?? [];
+    }, ...(ngDevMode ? [{ debugName: "validationErrors" }] : /* istanbul ignore next */ []));
+    /** 是否有规则 */
+    hasRules = computed(() => {
+        const group = this.rootGroup();
+        return group && group.rules.length > 0;
+    }, ...(ngDevMode ? [{ debugName: "hasRules" }] : /* istanbul ignore next */ []));
+    constructor() {
+        // 在构造函数中初始化服务（非 reactive context）
+        this.service = createQueryBuilderService({
+            config: {
+                maxNestingLevel: this.maxDepth()
+            }
+        });
+        this.dragDropHandler = new QueryDragDropHandler((itemId, targetGroupId, targetIndex) => this.service.moveItem(itemId, targetGroupId, targetIndex));
+        // 转换 Observable 为 Signal（必须在 reactive context 外部）
+        this.rootGroupSignal = toSignal(this.service.rootGroup$, { requireSync: true });
+        this.validationSignal = toSignal(this.service.validation$, { initialValue: undefined });
+        // 监听字段变化并同步到服务
+        effect(() => {
+            const fields = this.fieldsComputed();
+            if (fields.length > 0) {
+                this.service.setFields(fields);
+            }
+        });
+        // 监听初始查询并加载（引用变化时重新加载，用户修改不影响此 signal 故不会覆盖）
+        effect(() => {
+            const initial = this.initialQuery();
+            if (initial !== undefined && initial !== this.lastAppliedInitialQuery) {
+                this.lastAppliedInitialQuery = initial;
+                this.service.fromRxDBQuery(initial);
+            }
+        });
+        // 监听查询变化并发出事件
+        effect(() => {
+            const group = this.rootGroup();
+            if (group) {
+                const query = this.service.toRxDBQuery();
+                this.queryChange.emit(query);
+            }
+        });
+        // 监听验证变化并发出事件
+        effect(() => {
+            const validation = this.validationSignal();
+            if (validation) {
+                this.validationChange.emit(validation);
+            }
+        });
+    }
+    /** 销毁服务 */
+    ngOnDestroy() {
+        this.service.destroy();
+    }
+    /** 添加第一个规则 */
+    addFirstRule() {
+        const firstField = this.fieldsComputed()[0];
+        if (firstField) {
+            this.service.addRule(undefined, {
+                field: firstField.name,
+                operator: firstField.isRelation ? 'exists'
+                    : firstField.type === 'keyValue' ? 'null'
+                        : '=',
+                value: firstField.type === 'boolean' ? false : ''
+            });
+        }
+    }
+    /** 清空所有规则 */
+    clearAll() {
+        this.service.clear();
+    }
+    /** 添加规则到指定组 */
+    onAddRule(event) {
+        this.service.addRule(event.parentId, event.rule);
+        this.scrollToBottom();
+    }
+    /** 添加子组到指定组 */
+    onAddGroup(parentId) {
+        this.service.addGroup(parentId);
+        this.scrollToBottom();
+    }
+    /** 删除规则或组 */
+    onRemoveItem(id) {
+        this.service.remove(id);
+    }
+    /** 更新规则 */
+    onUpdateRule(event) {
+        this.service.updateRule(event.id, event.updates);
+    }
+    /** 更新组合器 */
+    onUpdateCombinator(event) {
+        this.service.updateGroupCombinator(event.id, event.combinator);
+    }
+    /** 键盘快捷键处理 */
+    onKeyDown(event) {
+        if (event.key === 'Escape' && this.hasRules()) {
+            event.preventDefault();
+            this.clearAll();
+            return;
+        }
+    }
+    scrollToBottom() {
+        setTimeout(() => {
+            const el = this.scrollContainer()?.nativeElement;
+            el?.scrollTo({ top: el.scrollHeight, behavior: 'smooth' });
+        }, 0);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: QueryBuilderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: QueryBuilderComponent, isStandalone: true, selector: "rxdb-query-builder", inputs: { schema: { classPropertyName: "schema", publicName: "schema", isSignal: true, isRequired: false, transformFunction: null }, fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: false, transformFunction: null }, initialQuery: { classPropertyName: "initialQuery", publicName: "initialQuery", isSignal: true, isRequired: false, transformFunction: null }, maxDepth: { classPropertyName: "maxDepth", publicName: "maxDepth", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, enableDrag: { classPropertyName: "enableDrag", publicName: "enableDrag", isSignal: true, isRequired: false, transformFunction: null }, enableCollapse: { classPropertyName: "enableCollapse", publicName: "enableCollapse", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { queryChange: "queryChange", validationChange: "validationChange" }, viewQueries: [{ propertyName: "scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    <div
+      class="rxdb-query-builder bg-base-100"
+      (keydown)="onKeyDown($event)"
+      aria-label="查询条件构建器"
+      role="search"
+      tabindex="0"
+    >
+      <div class="overflow-y-auto" #scrollContainer [style.max-height]="height()">
+        <!-- 标题栏 -->
+        <div class="mb-4 flex items-center justify-between">
+          <h3 class="text-base" id="query-builder-title">查询条件</h3>
+          <div class="flex gap-2" aria-label="查询操作" role="toolbar">
+            @if (hasRules()) {
+              <button
+                class="btn btn-ghost btn-sm"
+                (click)="clearAll()"
+                (keydown.enter)="clearAll()"
+                aria-label="清空所有查询条件"
+                title="清空所有查询条件 (Escape)"
+                type="button"
+              >
+                清空
+              </button>
+            }
+          </div>
+        </div>
+
+        <!-- 空状态提示 -->
+        @if (!hasRules()) {
+          <div class="text-base-content/60 py-8 text-center" aria-live="polite" role="status">
+            <div class="mb-2 flex justify-center" aria-hidden="true">
+              <svg
+                class="size-12 opacity-40"
+                fill="none"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <circle cx="11" cy="11" r="8" />
+                <path d="m21 21-4.3-4.3" />
+              </svg>
+            </div>
+            <p class="mb-4 min-w-md">还没有任何查询条件</p>
+            <button class="btn btn-sm" (click)="addFirstRule()" aria-label="添加第一个条件" type="button">
+              添加第一个条件
+            </button>
+          </div>
+        } @else {
+          <!-- 根规则组 -->
+          <rxdb-query-group
+            [allowCollapse]="enableCollapse()"
+            [depth]="0"
+            [dragDropHandler]="enableDrag() ? dragDropHandler : undefined"
+            [errors]="validationErrors()"
+            [fields]="fieldsComputed()"
+            [group]="rootGroup()!"
+            [maxDepth]="maxDepth()"
+            (addGroup)="onAddGroup($event)"
+            (addRule)="onAddRule($event)"
+            (removeItem)="onRemoveItem($event)"
+            (updateCombinator)="onUpdateCombinator($event)"
+            (updateRule)="onUpdateRule($event)"
+            role="region"
+          />
+        }
+      </div>
+    </div>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: QueryGroupComponent, selector: "rxdb-query-group", inputs: ["group", "fields", "errors", "depth", "maxDepth", "dragDropHandler", "allowCollapse"], outputs: ["addRule", "addGroup", "removeItem", "updateRule", "updateCombinator"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: QueryBuilderComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'rxdb-query-builder',
+                    standalone: true,
+                    imports: [CommonModule, QueryGroupComponent],
+                    template: `
+    <div
+      class="rxdb-query-builder bg-base-100"
+      (keydown)="onKeyDown($event)"
+      aria-label="查询条件构建器"
+      role="search"
+      tabindex="0"
+    >
+      <div class="overflow-y-auto" #scrollContainer [style.max-height]="height()">
+        <!-- 标题栏 -->
+        <div class="mb-4 flex items-center justify-between">
+          <h3 class="text-base" id="query-builder-title">查询条件</h3>
+          <div class="flex gap-2" aria-label="查询操作" role="toolbar">
+            @if (hasRules()) {
+              <button
+                class="btn btn-ghost btn-sm"
+                (click)="clearAll()"
+                (keydown.enter)="clearAll()"
+                aria-label="清空所有查询条件"
+                title="清空所有查询条件 (Escape)"
+                type="button"
+              >
+                清空
+              </button>
+            }
+          </div>
+        </div>
+
+        <!-- 空状态提示 -->
+        @if (!hasRules()) {
+          <div class="text-base-content/60 py-8 text-center" aria-live="polite" role="status">
+            <div class="mb-2 flex justify-center" aria-hidden="true">
+              <svg
+                class="size-12 opacity-40"
+                fill="none"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <circle cx="11" cy="11" r="8" />
+                <path d="m21 21-4.3-4.3" />
+              </svg>
+            </div>
+            <p class="mb-4 min-w-md">还没有任何查询条件</p>
+            <button class="btn btn-sm" (click)="addFirstRule()" aria-label="添加第一个条件" type="button">
+              添加第一个条件
+            </button>
+          </div>
+        } @else {
+          <!-- 根规则组 -->
+          <rxdb-query-group
+            [allowCollapse]="enableCollapse()"
+            [depth]="0"
+            [dragDropHandler]="enableDrag() ? dragDropHandler : undefined"
+            [errors]="validationErrors()"
+            [fields]="fieldsComputed()"
+            [group]="rootGroup()!"
+            [maxDepth]="maxDepth()"
+            (addGroup)="onAddGroup($event)"
+            (addRule)="onAddRule($event)"
+            (removeItem)="onRemoveItem($event)"
+            (updateCombinator)="onUpdateCombinator($event)"
+            (updateRule)="onUpdateRule($event)"
+            role="region"
+          />
+        }
+      </div>
+    </div>
+  `,
+                    changeDetection: ChangeDetectionStrategy.OnPush
+                }]
+        }], ctorParameters: () => [], propDecorators: { scrollContainer: [{ type: i0.ViewChild, args: ['scrollContainer', { isSignal: true }] }], schema: [{ type: i0.Input, args: [{ isSignal: true, alias: "schema", required: false }] }], fields: [{ type: i0.Input, args: [{ isSignal: true, alias: "fields", required: false }] }], initialQuery: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialQuery", required: false }] }], maxDepth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxDepth", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], enableDrag: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableDrag", required: false }] }], enableCollapse: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableCollapse", required: false }] }], queryChange: [{ type: i0.Output, args: ["queryChange"] }], validationChange: [{ type: i0.Output, args: ["validationChange"] }] } });
+
+const EMPTY_FILTER = { combinator: 'and', rules: [] };
+/**
+ * 实体列表组件
+ *
+ * 封装了实体列表的完整 UI：工具栏（显示名称、筛选、撤销/重做、新增）+ 数据表格。
+ * 通过 `namespace` 和 `name` 输入定位 RxDB 实体，实现懒加载分页和 CRUD 操作。
+ *
+ * @example
+ * ```html
+ * <rxdb-entity-list [namespace]="namespace()" [name]="name()" />
+ * ```
+ */
+class EntityListComponent {
+    #m2mDialogRef = null;
+    // ── Service injections ────────────────────────────────────────────────
+    #rxdb = inject(RxDB);
+    #injector = inject(Injector);
+    #dialog = inject(Dialog);
+    #errorHandler = inject(ErrorHandler);
+    // ── Save coalescing ───────────────────────────────────────────────────
+    #pendingChanges = new Map();
+    #flushHandle = false;
+    // ── Entity registry ───────────────────────────────────────────────────
+    #entityClsMap = new Map(this.#rxdb.config.entities.map(cls => {
+        const meta = getEntityMetadata(cls);
+        return [`${meta.namespace}:${meta.name}`, cls];
+    }));
+    #modelInfoMap = new Map(this.#rxdb.config.entities.map(cls => {
+        const meta = getEntityMetadata(cls);
+        return [
+            meta.name,
+            {
+                name: meta.name,
+                displayName: meta.displayName ?? meta.name,
+                entityClass: cls,
+                metadata: meta
+            }
+        ];
+    }));
+    #scrollListMap = new Map();
+    #columnsCache = new Map(this.#rxdb.config.entities.map(cls => {
+        const meta = getEntityMetadata(cls);
+        return [
+            `${meta.namespace}:${meta.name}`,
+            buildEditableColumns(meta, {
+                relatedItemsProviderFactory: (fkField, relatedEntityName) => {
+                    const relCls = [...this.#entityClsMap.values()].find(c => {
+                        const m = getEntityMetadata(c);
+                        return m.name === relatedEntityName;
+                    });
+                    if (!relCls)
+                        return undefined;
+                    const relKey = (() => {
+                        const m = getEntityMetadata(relCls);
+                        return `${m.namespace}:${m.name}`;
+                    })();
+                    const list = this.#getOrCreateList(relKey, relCls);
+                    const strVal = (v) => (typeof v === 'string' && v.length > 0 ? v : undefined);
+                    return () => {
+                        return list.value().map(inst => ({
+                            id: String(inst['id'] ?? ''),
+                            displayName: strVal(inst['displayName']) ?? strVal(inst['name']) ?? String(inst['id'] ?? '')
+                        }));
+                    };
+                }
+            })
+        ];
+    }));
+    #vHistory = this.#rxdb.versionManager.history();
+    #entityKey = computed(() => `${this.namespace()}:${this.name()}`, ...(ngDevMode ? [{ debugName: "#entityKey" }] : /* istanbul ignore next */ []));
+    #currentList = signal(undefined, ...(ngDevMode ? [{ debugName: "#currentList" }] : /* istanbul ignore next */ []));
+    #instances = computed(() => {
+        const list = this.#currentList();
+        return list ? list.value() : [];
+    }, ...(ngDevMode ? [{ debugName: "#instances" }] : /* istanbul ignore next */ []));
+    #entityCls = computed(() => this.#entityClsMap.get(this.#entityKey()), ...(ngDevMode ? [{ debugName: "#entityCls" }] : /* istanbul ignore next */ []));
+    /** 级联新增模式下本地草稿子实体（未保存到DB，由父实体级联保存） */
+    #localDraftItems = signal([], ...(ngDevMode ? [{ debugName: "#localDraftItems" }] : /* istanbul ignore next */ []));
+    // ── Protected view bindings ───────────────────────────────────────────
+    Undo2 = Undo2;
+    Redo2 = Redo2;
+    Funnel = Funnel;
+    /** CDK Overlay 定位策略：优先下方右对齐，其次上方右对齐 */
+    overlayPositions = [
+        {
+            originX: 'end',
+            originY: 'bottom',
+            overlayX: 'end',
+            overlayY: 'top',
+            offsetY: 4
+        },
+        {
+            originX: 'end',
+            originY: 'top',
+            overlayX: 'end',
+            overlayY: 'bottom',
+            offsetY: -4
+        }
+    ];
+    loadMore = computed(() => {
+        const list = this.#currentList();
+        return list ? () => list.loadMore() : undefined;
+    }, ...(ngDevMode ? [{ debugName: "loadMore" }] : /* istanbul ignore next */ []));
+    // ── Route inputs ──────────────────────────────────────────────────────
+    namespace = input.required(...(ngDevMode ? [{ debugName: "namespace" }] : /* istanbul ignore next */ []));
+    name = input.required(...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    /** 固定查询条件，与用户筛选条件做 AND 合并（用于关系属性过滤，如 ownerId = currentId） */
+    fixedQuery = input(undefined, ...(ngDevMode ? [{ debugName: "fixedQuery" }] : /* istanbul ignore next */ []));
+    /** 预填充的外键数据（级联新增时传递给子实体对话框） */
+    fixedFormData = input(undefined, ...(ngDevMode ? [{ debugName: "fixedFormData" }] : /* istanbul ignore next */ []));
+    /** 草稿父实体（用于级联新增场景，子实体通过关系API注册到父实体） */
+    draftParentEntity = input(null, ...(ngDevMode ? [{ debugName: "draftParentEntity" }] : /* istanbul ignore next */ []));
+    /** 父实体上关系属性名（如 'children'），用于调用 parent.children$.add(child) */
+    parentRelationName = input(undefined, ...(ngDevMode ? [{ debugName: "parentRelationName" }] : /* istanbul ignore next */ []));
+    /** 创建链路中的实体类型（namespace:name），用于阻断循环创建 */
+    creationChain = input([], ...(ngDevMode ? [{ debugName: "creationChain" }] : /* istanbul ignore next */ []));
+    /** 关系类型（MANY_TO_MANY 时启用选择模式） */
+    relationKind = input(undefined, ...(ngDevMode ? [{ debugName: "relationKind" }] : /* istanbul ignore next */ []));
+    /** 父实体实例（用于 M2M 关系操作，包含 draft 和已保存实体） */
+    parentEntity = input(null, ...(ngDevMode ? [{ debugName: "parentEntity" }] : /* istanbul ignore next */ []));
+    /** 列表模式：default=普通列表, select=选择模式（带 checkbox 列） */
+    mode = input('default', ...(ngDevMode ? [{ debugName: "mode" }] : /* istanbul ignore next */ []));
+    /** 已关联的实体 ID 集合（选择模式下过滤掉，不再展示） */
+    alreadyLinkedIds = input(new Set(), ...(ngDevMode ? [{ debugName: "alreadyLinkedIds" }] : /* istanbul ignore next */ []));
+    /** 点击「查看」按钮时触发，携带对应行记录 */
+    viewEntity = output();
+    /** 选择模式：确认选择时触发，携带选中的实体实例 */
+    selectionConfirmed = output();
+    /** 选择模式：取消选择时触发 */
+    selectionCancelled = output();
+    // ── Reactive state ────────────────────────────────────────────────────
+    filterQuery = linkedSignal(() => {
+        this.namespace();
+        this.name();
+        return { ...EMPTY_FILTER };
+    }, ...(ngDevMode ? [{ debugName: "filterQuery" }] : /* istanbul ignore next */ []));
+    $isFilterQuery = computed(() => this.filterQuery().rules.length > 0, ...(ngDevMode ? [{ debugName: "$isFilterQuery" }] : /* istanbul ignore next */ []));
+    showFilterPopover = signal(false, ...(ngDevMode ? [{ debugName: "showFilterPopover" }] : /* istanbul ignore next */ []));
+    pendingQuery = linkedSignal(() => {
+        this.namespace();
+        this.name();
+        return { ...EMPTY_FILTER };
+    }, ...(ngDevMode ? [{ debugName: "pendingQuery" }] : /* istanbul ignore next */ []));
+    pendingQueryValid = signal(true, ...(ngDevMode ? [{ debugName: "pendingQueryValid" }] : /* istanbul ignore next */ []));
+    isBrowser = isPlatformBrowser(inject(PLATFORM_ID));
+    displayName = computed(() => {
+        const cls = this.#entityCls();
+        if (!cls)
+            return this.name();
+        const meta = getEntityMetadata(cls);
+        return meta.displayName ?? meta.name;
+    }, ...(ngDevMode ? [{ debugName: "displayName" }] : /* istanbul ignore next */ []));
+    /** 当前实体是否存在于祖先创建链路中（循环创建检测） */
+    isCreateBlocked = computed(() => this.creationChain().includes(this.#entityKey()), ...(ngDevMode ? [{ debugName: "isCreateBlocked" }] : /* istanbul ignore next */ []));
+    isQueryActive = computed(() => this.filterQuery().rules.length > 0, ...(ngDevMode ? [{ debugName: "isQueryActive" }] : /* istanbul ignore next */ []));
+    filteredCount = computed(() => this.#instances().length + this.#localDraftItems().length, ...(ngDevMode ? [{ debugName: "filteredCount" }] : /* istanbul ignore next */ []));
+    isInitialLoading = computed(() => {
+        const list = this.#currentList();
+        return list ? list.isLoading() && list.value().length === 0 : false;
+    }, ...(ngDevMode ? [{ debugName: "isInitialLoading" }] : /* istanbul ignore next */ []));
+    isLoadingMore = computed(() => {
+        const list = this.#currentList();
+        return list ? list.isLoading() && list.value().length > 0 : false;
+    }, ...(ngDevMode ? [{ debugName: "isLoadingMore" }] : /* istanbul ignore next */ []));
+    undoCount = toSignal(this.#vHistory.undoCount$, { initialValue: 0 });
+    redoCount = toSignal(this.#vHistory.redoCount$, { initialValue: 0 });
+    canUndo = computed(() => this.undoCount() > 0, ...(ngDevMode ? [{ debugName: "canUndo" }] : /* istanbul ignore next */ []));
+    canRedo = computed(() => this.redoCount() > 0, ...(ngDevMode ? [{ debugName: "canRedo" }] : /* istanbul ignore next */ []));
+    queryBuilderFields = computed(() => {
+        const cls = this.#entityCls();
+        if (!cls)
+            return [];
+        return organizeFields(extractFieldsFromMetadata(getEntityMetadata(cls), this.#modelInfoMap));
+    }, ...(ngDevMode ? [{ debugName: "queryBuilderFields" }] : /* istanbul ignore next */ []));
+    tableRecords = computed(() => {
+        const dbRecords = this.#instances().map(inst => ({ ...inst }));
+        const draftRecords = this.#localDraftItems().map(inst => ({ ...inst }));
+        let records = [...draftRecords, ...dbRecords];
+        if (this.isSelectMode()) {
+            const linkedIds = this.alreadyLinkedIds();
+            const selIds = this.selectedIds();
+            records = records
+                .filter(r => !linkedIds.has(r['id']))
+                .map(r => ({ ...r, __selected: selIds.has(r['id']) }));
+        }
+        return records;
+    }, ...(ngDevMode ? [{ debugName: "tableRecords" }] : /* istanbul ignore next */ []));
+    tableColumns = computed(() => {
+        const base = this.#columnsCache.get(this.#entityKey()) ?? [actionsColumn('操作', '删除', '查看')];
+        if (this.isSelectMode()) {
+            const withoutActions = base.filter(c => c['field'] !== 'actions');
+            return [{ field: '__selected', title: '', cellType: 'checkbox', width: 50 }, ...withoutActions];
+        }
+        return base;
+    }, ...(ngDevMode ? [{ debugName: "tableColumns" }] : /* istanbul ignore next */ []));
+    createFormFieldConfigs = computed(() => {
+        const cls = this.#entityCls();
+        if (!cls)
+            return [];
+        const meta = getEntityMetadata(cls);
+        return buildFormFields(meta, 'create');
+    }, ...(ngDevMode ? [{ debugName: "createFormFieldConfigs" }] : /* istanbul ignore next */ []));
+    // ── Select mode ───────────────────────────────────────────────────────
+    isSelectMode = computed(() => this.mode() === 'select', ...(ngDevMode ? [{ debugName: "isSelectMode" }] : /* istanbul ignore next */ []));
+    isM2m = computed(() => this.relationKind() === RelationKind.MANY_TO_MANY, ...(ngDevMode ? [{ debugName: "isM2m" }] : /* istanbul ignore next */ []));
+    m2mSelectTpl = viewChild('m2mSelectTpl', ...(ngDevMode ? [{ debugName: "m2mSelectTpl" }] : /* istanbul ignore next */ []));
+    selectedIds = signal(new Set(), ...(ngDevMode ? [{ debugName: "selectedIds" }] : /* istanbul ignore next */ []));
+    selectedCount = computed(() => this.selectedIds().size, ...(ngDevMode ? [{ debugName: "selectedCount" }] : /* istanbul ignore next */ []));
+    m2mAlreadyLinkedIds = computed(() => {
+        const dbIds = this.#instances().map(e => e.id);
+        const draftIds = this.#localDraftItems().map(e => e.id);
+        return new Set([...dbIds, ...draftIds]);
+    }, ...(ngDevMode ? [{ debugName: "m2mAlreadyLinkedIds" }] : /* istanbul ignore next */ []));
+    // ── Constructor ───────────────────────────────────────────────────────
+    constructor() {
+        toObservable(this.#entityKey)
+            .pipe(takeUntilDestroyed())
+            .subscribe(key => {
+            const cls = this.#entityClsMap.get(key);
+            if (!cls) {
+                this.#currentList.set(undefined);
+                return;
+            }
+            this.#currentList.set(this.#getOrCreateList(key, cls));
+        });
+    }
+    // ── Event handlers ────────────────────────────────────────────────────
+    toggleFilterPopover() {
+        this.showFilterPopover.update(v => !v);
+    }
+    applyFilter() {
+        this.filterQuery.set({ ...this.pendingQuery() });
+        this.showFilterPopover.set(false);
+    }
+    resetFilter() {
+        this.pendingQuery.set({ ...EMPTY_FILTER });
+        this.filterQuery.set({ ...EMPTY_FILTER });
+    }
+    onKeydown(e) {
+        const tag = e.target?.tagName;
+        if (tag === 'INPUT' || tag === 'TEXTAREA' || tag === 'SELECT')
+            return;
+        if ((e.ctrlKey || e.metaKey) && e.key === 'z') {
+            if (e.shiftKey) {
+                if (this.canRedo()) {
+                    e.preventDefault();
+                    void this.redo();
+                }
+            }
+            else {
+                if (this.canUndo()) {
+                    e.preventDefault();
+                    void this.undo();
+                }
+            }
+        }
+    }
+    onQueryChange(query) {
+        this.pendingQuery.set(query ?? { ...EMPTY_FILTER });
+    }
+    onValidationChange(result) {
+        this.pendingQueryValid.set(result.valid);
+    }
+    onCellChanged(event) {
+        if (!event.field || event.field === 'actions')
+            return;
+        if (event.field === '__selected') {
+            const id = event.record['id'];
+            this.selectedIds.update(set => {
+                const next = new Set(set);
+                if (event.value)
+                    next.add(id);
+                else
+                    next.delete(id);
+                return next;
+            });
+            return;
+        }
+        const id = event.record['id'];
+        const entityCls = this.#entityCls();
+        let value = event.value;
+        if (entityCls) {
+            const prop = getEntityMetadata(entityCls).propertyMap.get(event.field);
+            if (prop)
+                value = parsePropertyColumnValue(prop.type, event.value);
+        }
+        this.#enqueue(id, { [event.field]: value });
+    }
+    undo() {
+        this.#vHistory.undo();
+    }
+    redo() {
+        this.#vHistory.redo();
+    }
+    async onIconClicked(event) {
+        if (event.name === 'view-action') {
+            this.viewEntity.emit(event.record);
+            return;
+        }
+        if (event.name !== 'delete-action')
+            return;
+        const id = event.record['id'];
+        const draftInst = this.#localDraftItems().find(i => i.id === id);
+        if (draftInst) {
+            this.#localDraftItems.update(items => items.filter(i => i.id !== id));
+            return;
+        }
+        const inst = this.#instances().find(i => i.id === id);
+        if (!inst)
+            return;
+        try {
+            await inst.remove();
+        }
+        catch (e) {
+            this.#errorHandler.handleError(e);
+        }
+    }
+    async onRowDeleted(event) {
+        await this.onIconClicked({ name: 'delete-action', record: event });
+    }
+    onBatchUpdated(mutations) {
+        for (const { recordId, changes } of mutations) {
+            const filtered = Object.fromEntries(Object.entries(changes).filter(([k]) => k && k !== 'actions'));
+            if (Object.keys(filtered).length)
+                this.#enqueue(recordId, filtered);
+        }
+    }
+    openCreateDialog() {
+        if (this.isCreateBlocked())
+            return;
+        const fields = this.createFormFieldConfigs();
+        const cls = this.#entityCls();
+        if (!cls || fields.length === 0)
+            return;
+        const meta = getEntityMetadata(cls);
+        const strVal = (v) => (typeof v === 'string' && v.length > 0 ? v : undefined);
+        const draftParent = this.draftParentEntity();
+        const relatedEntityProvider = (entityName, namespace) => {
+            const relCls = [...this.#entityClsMap.values()].find(c => {
+                const m = getEntityMetadata(c);
+                return m.name === entityName && (!namespace || m.namespace === namespace);
+            });
+            if (!relCls)
+                return [];
+            const relMeta = getEntityMetadata(relCls);
+            const list = this.#getOrCreateList(`${relMeta.namespace}:${relMeta.name}`, relCls);
+            const items = list.value().map(inst => ({
+                id: String(inst['id'] ?? ''),
+                displayName: strVal(inst['displayName']) ?? strVal(inst['name']) ?? String(inst['id'] ?? '')
+            }));
+            if (draftParent) {
+                const parentMeta = getEntityMetadata(draftParent.constructor);
+                if (parentMeta.name === entityName && (!namespace || parentMeta.namespace === namespace)) {
+                    const parentId = String(draftParent.id);
+                    if (!items.some(i => i.id === parentId)) {
+                        items.push({
+                            id: parentId,
+                            displayName: strVal(draftParent['displayName']) ?? strVal(draftParent['name']) ?? parentId
+                        });
+                    }
+                }
+            }
+            return items;
+        };
+        void Promise.resolve().then(function () { return entityDetail; }).then(({ EntityDetailComponent }) => {
+            const dialogRef = this.#dialog.open(EntityDetailComponent, {
+                width: '720px',
+                minWidth: '400px',
+                height: '80vh',
+                minHeight: '300px',
+                panelClass: 'entity-detail-dialog',
+                data: {
+                    metadata: meta,
+                    formFields: fields,
+                    formData: {},
+                    formMode: 'create',
+                    relatedEntityProvider,
+                    fixedFormData: this.fixedFormData(),
+                    delegateSave: !!this.draftParentEntity(),
+                    creationChain: this.creationChain()
+                }
+            });
+            dialogRef.componentInstance.formSubmitted.subscribe((result) => {
+                this.#handleCreateSubmit(result);
+                dialogRef.close();
+            });
+            dialogRef.closed.subscribe(result => {
+                if (result === 'saved')
+                    this.#currentList()?.refresh();
+            });
+        });
+    }
+    // ── M2M / Select mode methods ─────────────────────────────────────────
+    openM2mSelectDialog() {
+        if (this.#m2mDialogRef)
+            return;
+        const tpl = this.m2mSelectTpl();
+        if (!tpl)
+            return;
+        const ref = this.#dialog.open(tpl, {
+            width: '720px',
+            minWidth: '400px',
+            height: '70vh',
+            minHeight: '300px',
+            panelClass: 'entity-m2m-select-dialog'
+        });
+        this.#m2mDialogRef = ref;
+        ref.closed.subscribe(() => {
+            this.#m2mDialogRef = null;
+        });
+    }
+    onM2mSelectionConfirmed(entities) {
+        const parent = this.parentEntity();
+        const relName = this.parentRelationName();
+        if (parent && relName) {
+            const relation = parent[relName + '$'];
+            if (relation && typeof relation['add'] === 'function') {
+                relation.add(...entities);
+            }
+            if (!this.draftParentEntity()) {
+                parent
+                    .save()
+                    .then(() => this.#currentList()?.refresh())
+                    .catch(e => this.#errorHandler.handleError(e));
+            }
+            else {
+                this.#localDraftItems.update(items => [...items, ...entities]);
+            }
+        }
+        this.#m2mDialogRef?.close();
+    }
+    m2mCancelSelection() {
+        this.#m2mDialogRef?.close();
+    }
+    confirmSelection() {
+        const ids = this.selectedIds();
+        if (ids.size === 0) {
+            this.selectionCancelled.emit();
+            return;
+        }
+        const entities = this.#instances().filter(e => ids.has(e.id));
+        this.selectionConfirmed.emit(entities);
+    }
+    cancelSelection() {
+        this.selectionCancelled.emit();
+    }
+    // ── Private helpers ───────────────────────────────────────────────────
+    async #handleCreateSubmit(data) {
+        const cls = this.#entityCls();
+        if (!cls)
+            return;
+        const parent = this.draftParentEntity();
+        const relName = this.parentRelationName();
+        if (parent && relName) {
+            const child = new cls(data);
+            const relation = parent[relName + '$'];
+            if (relation && typeof relation.add === 'function') {
+                relation.add(child);
+            }
+            this.#localDraftItems.update(items => [...items, child]);
+            return;
+        }
+        try {
+            const inst = new cls(data);
+            await inst.save();
+            this.#currentList()?.refresh();
+        }
+        catch (e) {
+            this.#errorHandler.handleError(e);
+        }
+    }
+    #getOrCreateList(key, cls) {
+        const cached = this.#scrollListMap.get(key);
+        if (cached)
+            return cached;
+        const options = computed(() => {
+            const userFilter = this.filterQuery();
+            const fixed = this.fixedQuery();
+            let where;
+            if (!fixed || fixed.rules.length === 0) {
+                where = userFilter;
+            }
+            else if (userFilter.rules.length === 0) {
+                where = fixed;
+            }
+            else {
+                where = { combinator: 'and', rules: [...fixed.rules, ...userFilter.rules] };
+            }
+            return {
+                where: where,
+                orderBy: [{ field: 'id', sort: 'desc' }]
+            };
+        }, ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
+        const list = runInInjectionContext(this.#injector, () => new InfiniteScrollingList(this.#rxdb, cls, options));
+        this.#scrollListMap.set(key, list);
+        return list;
+    }
+    #enqueue(recordId, changes) {
+        const cur = this.#pendingChanges.get(recordId) ?? {};
+        this.#pendingChanges.set(recordId, { ...cur, ...changes });
+        if (this.#flushHandle)
+            return;
+        this.#flushHandle = true;
+        queueMicrotask(() => {
+            this.#flushHandle = false;
+            const snapshot = [...this.#pendingChanges.entries()];
+            this.#pendingChanges.clear();
+            void this.#flushPending(snapshot);
+        });
+    }
+    async #flushPending(pending) {
+        if (!pending.length)
+            return;
+        const EntityClass = this.#entityCls();
+        if (!EntityClass)
+            return;
+        const toUpdate = new Set();
+        const prevMap = new Map();
+        const draftUpdated = new Set();
+        for (const [id, changes] of pending) {
+            let inst = this.#instances().find(i => i.id === id);
+            const isDraft = !inst;
+            if (!inst) {
+                inst = this.#localDraftItems().find(i => i.id === id);
+            }
+            if (!inst)
+                continue;
+            const prev = {};
+            const actual = {};
+            let hasChange = false;
+            for (const k of Object.keys(changes)) {
+                if (inst[k] !== changes[k]) {
+                    prev[k] = inst[k];
+                    actual[k] = changes[k];
+                    hasChange = true;
+                }
+            }
+            if (!hasChange)
+                continue;
+            prevMap.set(inst, prev);
+            Object.assign(inst, actual);
+            if (isDraft) {
+                draftUpdated.add(inst);
+            }
+            else {
+                toUpdate.add(inst);
+            }
+        }
+        // 草稿实体直接更新 signal 触发重渲染（不写DB）
+        if (draftUpdated.size) {
+            this.#localDraftItems.update(items => [...items]);
+        }
+        if (!toUpdate.size)
+            return;
+        const updateMap = new Map([[EntityClass, toUpdate]]);
+        try {
+            await this.#rxdb.entityManager.mutations({ create: new Map(), update: updateMap, remove: new Map() });
+        }
+        catch (e) {
+            this.#errorHandler.handleError(e);
+            for (const [inst, prev] of prevMap)
+                Object.assign(inst, prev);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: EntityListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: EntityListComponent, isStandalone: true, selector: "rxdb-entity-list", inputs: { namespace: { classPropertyName: "namespace", publicName: "namespace", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, fixedQuery: { classPropertyName: "fixedQuery", publicName: "fixedQuery", isSignal: true, isRequired: false, transformFunction: null }, fixedFormData: { classPropertyName: "fixedFormData", publicName: "fixedFormData", isSignal: true, isRequired: false, transformFunction: null }, draftParentEntity: { classPropertyName: "draftParentEntity", publicName: "draftParentEntity", isSignal: true, isRequired: false, transformFunction: null }, parentRelationName: { classPropertyName: "parentRelationName", publicName: "parentRelationName", isSignal: true, isRequired: false, transformFunction: null }, creationChain: { classPropertyName: "creationChain", publicName: "creationChain", isSignal: true, isRequired: false, transformFunction: null }, relationKind: { classPropertyName: "relationKind", publicName: "relationKind", isSignal: true, isRequired: false, transformFunction: null }, parentEntity: { classPropertyName: "parentEntity", publicName: "parentEntity", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, alreadyLinkedIds: { classPropertyName: "alreadyLinkedIds", publicName: "alreadyLinkedIds", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { viewEntity: "viewEntity", selectionConfirmed: "selectionConfirmed", selectionCancelled: "selectionCancelled" }, host: { listeners: { "keydown": "onKeydown($event)" }, styleAttribute: "display:flex;flex-direction:column;height:100%;overflow:hidden" }, viewQueries: [{ propertyName: "m2mSelectTpl", first: true, predicate: ["m2mSelectTpl"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- \u9876\u680F\uFF1A\u5B9E\u4F53\u540D\u79F0 + \u8BA1\u6570 + \u7B5B\u9009\u6309\u94AE + \u65B0\u589E\u6309\u94AE -->\n<div class=\"border-base-300 flex shrink-0 items-center justify-between border-b px-4 py-2\">\n  <div class=\"flex items-center gap-2 text-sm\">\n    <span class=\"font-medium\">{{ displayName() }}</span>\n    @if ($isFilterQuery()) {\n      <span class=\"badge badge-ghost badge-sm\">{{ filteredCount() }} \u6761\u8BB0\u5F55</span>\n    }\n  </div>\n  <div class=\"flex items-center gap-2\">\n    @if (!isSelectMode()) {\n      <!-- Undo / Redo -->\n      <button\n        class=\"btn btn-xs btn-ghost\"\n        [disabled]=\"!canUndo()\"\n        (click)=\"undo()\"\n        aria-label=\"\u64A4\u9500 (Ctrl+Z)\"\n        type=\"button\"\n      >\n        <lucide-icon class=\"h-3.5 w-3.5\" [img]=\"Undo2\" />\n        @if (undoCount(); as c) {\n          <span class=\"badge badge-xs\">{{ c }}</span>\n        }\n      </button>\n      <button\n        class=\"btn btn-xs btn-ghost\"\n        [disabled]=\"!canRedo()\"\n        (click)=\"redo()\"\n        aria-label=\"\u91CD\u505A (Ctrl+Shift+Z)\"\n        type=\"button\"\n      >\n        <lucide-icon class=\"h-3.5 w-3.5\" [img]=\"Redo2\" />\n        @if (redoCount(); as c) {\n          <span class=\"badge badge-xs\">{{ c }}</span>\n        }\n      </button>\n      <div class=\"divider divider-horizontal mx-0.5 h-5 self-center\"></div>\n    }\n    <!-- \u7B5B\u9009 popover \u89E6\u53D1\u5668 -->\n    <div>\n      <button\n        class=\"btn btn-ghost btn-sm gap-1\"\n        #filterTrigger=\"cdkOverlayOrigin\"\n        [class.btn-active]=\"isQueryActive()\"\n        (click)=\"toggleFilterPopover()\"\n        cdkOverlayOrigin\n        type=\"button\"\n      >\n        <lucide-icon class=\"h-4 w-4\" [img]=\"Funnel\" />\n        \u7B5B\u9009\n        @if (isQueryActive()) {\n          <span class=\"badge badge-primary badge-xs\">{{ filterQuery().rules.length }}</span>\n        }\n      </button>\n      <ng-template\n        [cdkConnectedOverlayBackdropClass]=\"'cdk-overlay-transparent-backdrop'\"\n        [cdkConnectedOverlayHasBackdrop]=\"true\"\n        [cdkConnectedOverlayOpen]=\"showFilterPopover()\"\n        [cdkConnectedOverlayOrigin]=\"filterTrigger\"\n        [cdkConnectedOverlayPositions]=\"overlayPositions\"\n        (backdropClick)=\"showFilterPopover.set(false)\"\n        cdkConnectedOverlay\n      >\n        @if (queryBuilderFields().length > 0) {\n          <div\n            class=\"border-base-300 bg-base-100 min-w-max rounded-lg border p-3 shadow-lg\"\n            (click)=\"$event.stopPropagation()\"\n            aria-hidden=\"true\"\n          >\n            <rxdb-query-builder\n              [fields]=\"queryBuilderFields()\"\n              [initialQuery]=\"$any(filterQuery())\"\n              (queryChange)=\"onQueryChange($event)\"\n              (validationChange)=\"onValidationChange($event)\"\n            />\n            <div class=\"mt-3 flex justify-end gap-2\">\n              <button class=\"btn btn-ghost btn-sm\" (click)=\"resetFilter()\" type=\"button\">\u91CD\u7F6E</button>\n              <button\n                class=\"btn btn-primary btn-sm\"\n                [disabled]=\"!pendingQueryValid()\"\n                (click)=\"applyFilter()\"\n                type=\"button\"\n              >\n                \u786E\u5B9A\n              </button>\n            </div>\n          </div>\n        }\n      </ng-template>\n    </div>\n    @if (!isCreateBlocked()) {\n      @if (isSelectMode()) {\n        <button class=\"btn btn-sm btn-outline\" (click)=\"openCreateDialog()\" type=\"button\">+ \u65B0\u5EFA</button>\n      } @else if (isM2m()) {\n        <button class=\"btn btn-primary btn-sm\" (click)=\"openM2mSelectDialog()\" type=\"button\">+ \u6DFB\u52A0</button>\n      } @else {\n        <button class=\"btn btn-primary btn-sm\" (click)=\"openCreateDialog()\" type=\"button\">+ \u65B0\u589E</button>\n      }\n    }\n  </div>\n</div>\n\n<!-- \u8868\u683C\u4E3B\u4F53 -->\n<div class=\"min-h-0 flex-1\">\n  @if (isBrowser) {\n    @for (key of [namespace() + ':' + name()]; track key) {\n      <rxdb-query-table\n        [columns]=\"tableColumns()\"\n        [filteredCount]=\"filteredCount()\"\n        [loading]=\"isInitialLoading()\"\n        [loadingMore]=\"isLoadingMore()\"\n        [loadMore]=\"loadMore()\"\n        [queryActive]=\"isQueryActive()\"\n        [records]=\"tableRecords()\"\n        (batchUpdated)=\"onBatchUpdated($event)\"\n        (cellChanged)=\"onCellChanged($event)\"\n        (iconClicked)=\"onIconClicked($event)\"\n        (rowDeleted)=\"onRowDeleted($event)\"\n      />\n    }\n  }\n</div>\n\n<!-- Select mode footer -->\n@if (isSelectMode()) {\n  <div class=\"border-base-300 flex shrink-0 items-center justify-between border-t px-4 py-3\">\n    @if (selectedCount() > 0) {\n      <span class=\"text-base-content/70 text-sm\">\u5DF2\u9009 {{ selectedCount() }} \u9879</span>\n    } @else {\n      <span class=\"text-base-content/40 text-sm\">\u8BF7\u9009\u62E9\u8981\u5173\u8054\u7684{{ displayName() }}</span>\n    }\n    <div class=\"flex gap-2\">\n      <button class=\"btn btn-sm\" (click)=\"cancelSelection()\" type=\"button\">\u53D6\u6D88</button>\n      <button\n        class=\"btn btn-primary btn-sm\"\n        [disabled]=\"selectedCount() === 0\"\n        (click)=\"confirmSelection()\"\n        type=\"button\"\n      >\n        \u786E\u8BA4\u6DFB\u52A0\n      </button>\n    </div>\n  </div>\n}\n\n<!-- M2M Selection Dialog Template -->\n<ng-template #m2mSelectTpl>\n  <rxdb-entity-dialog [title]=\"'\u6DFB\u52A0' + displayName()\" (closeRequested)=\"m2mCancelSelection()\">\n    <rxdb-entity-list\n      [alreadyLinkedIds]=\"m2mAlreadyLinkedIds()\"\n      [mode]=\"'select'\"\n      [name]=\"name()\"\n      [namespace]=\"namespace()\"\n      (selectionCancelled)=\"m2mCancelSelection()\"\n      (selectionConfirmed)=\"onM2mSelectionConfirmed($event)\"\n    />\n  </rxdb-entity-dialog>\n</ng-template>\n", dependencies: [{ kind: "component", type: i0.forwardRef(() => EntityListComponent), selector: "rxdb-entity-list", inputs: ["namespace", "name", "fixedQuery", "fixedFormData", "draftParentEntity", "parentRelationName", "creationChain", "relationKind", "parentEntity", "mode", "alreadyLinkedIds"], outputs: ["viewEntity", "selectionConfirmed", "selectionCancelled"] }, { kind: "component", type: i0.forwardRef(() => QueryTableComponent), selector: "rxdb-query-table", inputs: ["records", "columns", "idField", "nonClearableFields", "tableOptions", "cellErrorDetector", "isDarkMode", "cellClearable", "queryActive", "totalCount", "filteredCount", "loading", "loadingMore", "loadMore"], outputs: ["cellChanged", "rowDeleted", "iconClicked", "batchUpdated", "rowReordered", "scrollNearBottom"] }, { kind: "component", type: i0.forwardRef(() => QueryBuilderComponent), selector: "rxdb-query-builder", inputs: ["schema", "fields", "initialQuery", "maxDepth", "height", "enableDrag", "enableCollapse"], outputs: ["queryChange", "validationChange"] }, { kind: "ngmodule", type: i0.forwardRef(() => LucideAngularModule) }, { kind: "component", type: i0.forwardRef(() => i2.LucideAngularComponent), selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }, { kind: "directive", type: i0.forwardRef(() => CdkConnectedOverlay), selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i0.forwardRef(() => CdkOverlayOrigin), selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: i0.forwardRef(() => EntityDialogComponent), selector: "rxdb-entity-dialog", inputs: ["title"], outputs: ["closeRequested"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: EntityListComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rxdb-entity-list', host: {
+                        style: 'display:flex;flex-direction:column;height:100%;overflow:hidden'
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+                        QueryTableComponent,
+                        QueryBuilderComponent,
+                        LucideAngularModule,
+                        CdkConnectedOverlay,
+                        CdkOverlayOrigin,
+                        forwardRef(() => EntityListComponent),
+                        forwardRef(() => EntityDialogComponent)
+                    ], template: "<!-- \u9876\u680F\uFF1A\u5B9E\u4F53\u540D\u79F0 + \u8BA1\u6570 + \u7B5B\u9009\u6309\u94AE + \u65B0\u589E\u6309\u94AE -->\n<div class=\"border-base-300 flex shrink-0 items-center justify-between border-b px-4 py-2\">\n  <div class=\"flex items-center gap-2 text-sm\">\n    <span class=\"font-medium\">{{ displayName() }}</span>\n    @if ($isFilterQuery()) {\n      <span class=\"badge badge-ghost badge-sm\">{{ filteredCount() }} \u6761\u8BB0\u5F55</span>\n    }\n  </div>\n  <div class=\"flex items-center gap-2\">\n    @if (!isSelectMode()) {\n      <!-- Undo / Redo -->\n      <button\n        class=\"btn btn-xs btn-ghost\"\n        [disabled]=\"!canUndo()\"\n        (click)=\"undo()\"\n        aria-label=\"\u64A4\u9500 (Ctrl+Z)\"\n        type=\"button\"\n      >\n        <lucide-icon class=\"h-3.5 w-3.5\" [img]=\"Undo2\" />\n        @if (undoCount(); as c) {\n          <span class=\"badge badge-xs\">{{ c }}</span>\n        }\n      </button>\n      <button\n        class=\"btn btn-xs btn-ghost\"\n        [disabled]=\"!canRedo()\"\n        (click)=\"redo()\"\n        aria-label=\"\u91CD\u505A (Ctrl+Shift+Z)\"\n        type=\"button\"\n      >\n        <lucide-icon class=\"h-3.5 w-3.5\" [img]=\"Redo2\" />\n        @if (redoCount(); as c) {\n          <span class=\"badge badge-xs\">{{ c }}</span>\n        }\n      </button>\n      <div class=\"divider divider-horizontal mx-0.5 h-5 self-center\"></div>\n    }\n    <!-- \u7B5B\u9009 popover \u89E6\u53D1\u5668 -->\n    <div>\n      <button\n        class=\"btn btn-ghost btn-sm gap-1\"\n        #filterTrigger=\"cdkOverlayOrigin\"\n        [class.btn-active]=\"isQueryActive()\"\n        (click)=\"toggleFilterPopover()\"\n        cdkOverlayOrigin\n        type=\"button\"\n      >\n        <lucide-icon class=\"h-4 w-4\" [img]=\"Funnel\" />\n        \u7B5B\u9009\n        @if (isQueryActive()) {\n          <span class=\"badge badge-primary badge-xs\">{{ filterQuery().rules.length }}</span>\n        }\n      </button>\n      <ng-template\n        [cdkConnectedOverlayBackdropClass]=\"'cdk-overlay-transparent-backdrop'\"\n        [cdkConnectedOverlayHasBackdrop]=\"true\"\n        [cdkConnectedOverlayOpen]=\"showFilterPopover()\"\n        [cdkConnectedOverlayOrigin]=\"filterTrigger\"\n        [cdkConnectedOverlayPositions]=\"overlayPositions\"\n        (backdropClick)=\"showFilterPopover.set(false)\"\n        cdkConnectedOverlay\n      >\n        @if (queryBuilderFields().length > 0) {\n          <div\n            class=\"border-base-300 bg-base-100 min-w-max rounded-lg border p-3 shadow-lg\"\n            (click)=\"$event.stopPropagation()\"\n            aria-hidden=\"true\"\n          >\n            <rxdb-query-builder\n              [fields]=\"queryBuilderFields()\"\n              [initialQuery]=\"$any(filterQuery())\"\n              (queryChange)=\"onQueryChange($event)\"\n              (validationChange)=\"onValidationChange($event)\"\n            />\n            <div class=\"mt-3 flex justify-end gap-2\">\n              <button class=\"btn btn-ghost btn-sm\" (click)=\"resetFilter()\" type=\"button\">\u91CD\u7F6E</button>\n              <button\n                class=\"btn btn-primary btn-sm\"\n                [disabled]=\"!pendingQueryValid()\"\n                (click)=\"applyFilter()\"\n                type=\"button\"\n              >\n                \u786E\u5B9A\n              </button>\n            </div>\n          </div>\n        }\n      </ng-template>\n    </div>\n    @if (!isCreateBlocked()) {\n      @if (isSelectMode()) {\n        <button class=\"btn btn-sm btn-outline\" (click)=\"openCreateDialog()\" type=\"button\">+ \u65B0\u5EFA</button>\n      } @else if (isM2m()) {\n        <button class=\"btn btn-primary btn-sm\" (click)=\"openM2mSelectDialog()\" type=\"button\">+ \u6DFB\u52A0</button>\n      } @else {\n        <button class=\"btn btn-primary btn-sm\" (click)=\"openCreateDialog()\" type=\"button\">+ \u65B0\u589E</button>\n      }\n    }\n  </div>\n</div>\n\n<!-- \u8868\u683C\u4E3B\u4F53 -->\n<div class=\"min-h-0 flex-1\">\n  @if (isBrowser) {\n    @for (key of [namespace() + ':' + name()]; track key) {\n      <rxdb-query-table\n        [columns]=\"tableColumns()\"\n        [filteredCount]=\"filteredCount()\"\n        [loading]=\"isInitialLoading()\"\n        [loadingMore]=\"isLoadingMore()\"\n        [loadMore]=\"loadMore()\"\n        [queryActive]=\"isQueryActive()\"\n        [records]=\"tableRecords()\"\n        (batchUpdated)=\"onBatchUpdated($event)\"\n        (cellChanged)=\"onCellChanged($event)\"\n        (iconClicked)=\"onIconClicked($event)\"\n        (rowDeleted)=\"onRowDeleted($event)\"\n      />\n    }\n  }\n</div>\n\n<!-- Select mode footer -->\n@if (isSelectMode()) {\n  <div class=\"border-base-300 flex shrink-0 items-center justify-between border-t px-4 py-3\">\n    @if (selectedCount() > 0) {\n      <span class=\"text-base-content/70 text-sm\">\u5DF2\u9009 {{ selectedCount() }} \u9879</span>\n    } @else {\n      <span class=\"text-base-content/40 text-sm\">\u8BF7\u9009\u62E9\u8981\u5173\u8054\u7684{{ displayName() }}</span>\n    }\n    <div class=\"flex gap-2\">\n      <button class=\"btn btn-sm\" (click)=\"cancelSelection()\" type=\"button\">\u53D6\u6D88</button>\n      <button\n        class=\"btn btn-primary btn-sm\"\n        [disabled]=\"selectedCount() === 0\"\n        (click)=\"confirmSelection()\"\n        type=\"button\"\n      >\n        \u786E\u8BA4\u6DFB\u52A0\n      </button>\n    </div>\n  </div>\n}\n\n<!-- M2M Selection Dialog Template -->\n<ng-template #m2mSelectTpl>\n  <rxdb-entity-dialog [title]=\"'\u6DFB\u52A0' + displayName()\" (closeRequested)=\"m2mCancelSelection()\">\n    <rxdb-entity-list\n      [alreadyLinkedIds]=\"m2mAlreadyLinkedIds()\"\n      [mode]=\"'select'\"\n      [name]=\"name()\"\n      [namespace]=\"namespace()\"\n      (selectionCancelled)=\"m2mCancelSelection()\"\n      (selectionConfirmed)=\"onM2mSelectionConfirmed($event)\"\n    />\n  </rxdb-entity-dialog>\n</ng-template>\n" }]
+        }], ctorParameters: () => [], propDecorators: { namespace: [{ type: i0.Input, args: [{ isSignal: true, alias: "namespace", required: true }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], fixedQuery: [{ type: i0.Input, args: [{ isSignal: true, alias: "fixedQuery", required: false }] }], fixedFormData: [{ type: i0.Input, args: [{ isSignal: true, alias: "fixedFormData", required: false }] }], draftParentEntity: [{ type: i0.Input, args: [{ isSignal: true, alias: "draftParentEntity", required: false }] }], parentRelationName: [{ type: i0.Input, args: [{ isSignal: true, alias: "parentRelationName", required: false }] }], creationChain: [{ type: i0.Input, args: [{ isSignal: true, alias: "creationChain", required: false }] }], relationKind: [{ type: i0.Input, args: [{ isSignal: true, alias: "relationKind", required: false }] }], parentEntity: [{ type: i0.Input, args: [{ isSignal: true, alias: "parentEntity", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], alreadyLinkedIds: [{ type: i0.Input, args: [{ isSignal: true, alias: "alreadyLinkedIds", required: false }] }], viewEntity: [{ type: i0.Output, args: ["viewEntity"] }], selectionConfirmed: [{ type: i0.Output, args: ["selectionConfirmed"] }], selectionCancelled: [{ type: i0.Output, args: ["selectionCancelled"] }], m2mSelectTpl: [{ type: i0.ViewChild, args: ['m2mSelectTpl', { isSignal: true }] }], onKeydown: [{
+                type: HostListener,
+                args: ['keydown', ['$event']]
+            }] } });
+
+let nextDetailId = 0;
+class EntityDetailComponent {
+    #dialogRef = inject(DialogRef, { optional: true });
+    #dialogData = inject(DIALOG_DATA, { optional: true });
+    #rxdb = inject(RxDB, { optional: true });
+    #errorHandler = inject(ErrorHandler);
+    /** 创建模式下的草稿实体实例（立即创建，不保存） */
+    #draftEntity = null;
+    // 根据 namespace + name 查找对应实体类
+    #entityCls = computed(() => {
+        const rxdb = this.#rxdb;
+        if (!rxdb)
+            return null;
+        const ns = this.namespace();
+        const nm = this.name();
+        if (!ns || !nm)
+            return null;
+        return (rxdb.config.entities.find(cls => {
+            const meta = getEntityMetadata(cls);
+            return meta.namespace === ns && meta.name === nm;
+        }) ?? null);
+    }, ...(ngDevMode ? [{ debugName: "#entityCls" }] : /* istanbul ignore next */ []));
+    /** Dialog 传入的实体类（根据 metadata 查找） */
+    #entityClsFromDialog = computed(() => {
+        const rxdb = this.#rxdb;
+        const meta = this.#dialogData?.metadata;
+        if (!rxdb || !meta)
+            return null;
+        return (rxdb.config.entities.find(cls => {
+            const m = getEntityMetadata(cls);
+            return m.namespace === meta.namespace && m.name === meta.name;
+        }) ?? null);
+    }, ...(ngDevMode ? [{ debugName: "#entityClsFromDialog" }] : /* istanbul ignore next */ []));
+    #metadataFromRouteInputs = computed(() => {
+        const cls = this.#entityCls();
+        return cls ? getEntityMetadata(cls) : null;
+    }, ...(ngDevMode ? [{ debugName: "#metadataFromRouteInputs" }] : /* istanbul ignore next */ []));
+    #formFieldsFromRouteInputs = computed(() => {
+        const meta = this.#metadataFromRouteInputs();
+        if (!meta)
+            return null;
+        return buildFormFields(meta, this.formModeValue);
+    }, ...(ngDevMode ? [{ debugName: "#formFieldsFromRouteInputs" }] : /* istanbul ignore next */ []));
+    #entityInstance = toSignal(toObservable(computed(() => ({ cls: this.#entityCls(), id: this.entityId() }))).pipe(switchMap(({ cls, id }) => {
+        if (!cls || !id || !this.#rxdb)
+            return of(null);
+        return this.#rxdb.entityManager.getRepository(cls).get(id);
+    })), { initialValue: null });
+    // 路由参数输入（与 namespace/name/entityId 路由参数绑定）
+    namespace = input(...(ngDevMode ? [undefined, { debugName: "namespace" }] : /* istanbul ignore next */ []));
+    name = input(...(ngDevMode ? [undefined, { debugName: "name" }] : /* istanbul ignore next */ []));
+    entityId = input(...(ngDevMode ? [undefined, { debugName: "entityId" }] : /* istanbul ignore next */ []));
+    /** 唯一的 radio group name，避免多个 EntityDetailComponent 实例之间的 radio 冲突 */
+    tabGroupName = `detail-tabs-${nextDetailId++}`;
+    // 直接绑定输入
+    metadata = input(undefined, ...(ngDevMode ? [{ debugName: "metadata" }] : /* istanbul ignore next */ []));
+    formFields = input(...(ngDevMode ? [undefined, { debugName: "formFields" }] : /* istanbul ignore next */ []));
+    formData = input(...(ngDevMode ? [undefined, { debugName: "formData" }] : /* istanbul ignore next */ []));
+    formMode = input(undefined, ...(ngDevMode ? [{ debugName: "formMode" }] : /* istanbul ignore next */ []));
+    relatedEntityProvider = input(...(ngDevMode ? [undefined, { debugName: "relatedEntityProvider" }] : /* istanbul ignore next */ []));
+    formSubmitted = output();
+    formCancelled = output();
+    fieldChanged = output();
+    validationErrors = output();
+    /** 是否使用外部保存模式（create 模式下，保存/取消按钮在 tabs 下面，而非 form 内） */
+    isCreateMode = computed(() => this.formModeValue === 'create', ...(ngDevMode ? [{ debugName: "isCreateMode" }] : /* istanbul ignore next */ []));
+    /** 当前表单编辑数据（create 模式下跟踪用户输入） */
+    draftFormData = signal({}, ...(ngDevMode ? [{ debugName: "draftFormData" }] : /* istanbul ignore next */ []));
+    /** 暴露草稿实体给模板（关系 tab 的 entity-list 需要） */
+    draftEntitySignal = signal(null, ...(ngDevMode ? [{ debugName: "draftEntitySignal" }] : /* istanbul ignore next */ []));
+    /** 父实体（草稿或已保存实例），用于关系 tab 的 entity-list */
+    parentEntityForRelation = computed(() => {
+        return this.draftEntitySignal() ?? this.#entityInstance() ?? null;
+    }, ...(ngDevMode ? [{ debugName: "parentEntityForRelation" }] : /* istanbul ignore next */ []));
+    /** 弹框标题 */
+    dialogTitle = computed(() => {
+        const meta = this.metadataValue;
+        const mode = this.formModeValue;
+        const name = meta?.displayName ?? meta?.name ?? '';
+        return mode === 'create' ? `新建${name}` : name;
+    }, ...(ngDevMode ? [{ debugName: "dialogTitle" }] : /* istanbul ignore next */ []));
+    /** 创建链路：当前实体 + 祖先链路，传递给子 entity-list 以阻断循环创建 */
+    creationChain = computed(() => {
+        const parentChain = this.#dialogData?.creationChain ?? [];
+        if (!this.isCreateMode())
+            return parentChain;
+        const meta = this.metadataValue;
+        if (!meta)
+            return parentChain;
+        const key = `${meta.namespace}:${meta.name}`;
+        return parentChain.includes(key) ? parentChain : [...parentChain, key];
+    }, ...(ngDevMode ? [{ debugName: "creationChain" }] : /* istanbul ignore next */ []));
+    /** 当前活动关系 tab 的 relationName（用于子实体注册关系） */
+    activeRelationName = computed(() => {
+        const tab = this.activeTab();
+        return tab?.type === 'table' ? tab.relationName : undefined;
+    }, ...(ngDevMode ? [{ debugName: "activeRelationName" }] : /* istanbul ignore next */ []));
+    tabs = computed(() => {
+        const meta = this.metadataValue;
+        if (!meta)
+            return [];
+        const chain = this.creationChain();
+        return buildDetailTabs(meta).filter(tab => {
+            if (tab.type !== 'table')
+                return true;
+            const t = tab;
+            const key = `${t.relatedNamespace}:${t.relatedEntityName}`;
+            return !chain.includes(key);
+        });
+    }, ...(ngDevMode ? [{ debugName: "tabs" }] : /* istanbul ignore next */ []));
+    activeTabKey = linkedSignal({ ...(ngDevMode ? { debugName: "activeTabKey" } : /* istanbul ignore next */ {}), source: this.tabs,
+        computation: tabs => tabs[0]?.key ?? 'basic' });
+    activeTab = computed(() => this.tabs().find(t => t.key === this.activeTabKey()), ...(ngDevMode ? [{ debugName: "activeTab" }] : /* istanbul ignore next */ []));
+    // 公开访问器 - 优先级：直接 input > 路由推导 > dialog data
+    get metadataValue() {
+        return this.metadata() ?? this.#metadataFromRouteInputs() ?? this.#dialogData.metadata;
+    }
+    get formFieldsValue() {
+        const fields = this.formFields() ?? this.#formFieldsFromRouteInputs() ?? this.#dialogData.formFields;
+        const fixed = this.#dialogData?.fixedFormData;
+        if (!fixed)
+            return fields;
+        return fields.map(f => (f.field in fixed ? { ...f, readonly: true } : f));
+    }
+    get formDataValue() {
+        if (this.isCreateMode()) {
+            const draft = this.draftFormData();
+            const fixed = this.#dialogData?.fixedFormData;
+            return fixed ? { ...draft, ...fixed } : draft;
+        }
+        const inst = this.#entityInstance();
+        if (inst)
+            return entityToFormData(inst, this.formFieldsValue ?? []);
+        const base = this.formData() ?? this.#dialogData?.formData ?? {};
+        const fixed = this.#dialogData?.fixedFormData;
+        return fixed ? { ...base, ...fixed } : base;
+    }
+    get formModeValue() {
+        return this.formMode() ?? this.#dialogData?.formMode ?? 'edit';
+    }
+    get relatedEntityProviderValue() {
+        return this.relatedEntityProvider() ?? this.#dialogData?.relatedEntityProvider;
+    }
+    constructor() {
+        if (this.#dialogData?.formMode === 'create' && !this.#dialogData.delegateSave) {
+            const cls = this.#entityClsFromDialog();
+            if (cls) {
+                const fixed = this.#dialogData.fixedFormData;
+                const merged = { ...(this.#dialogData.formData || {}), ...fixed };
+                this.#draftEntity = new cls(merged);
+                this.draftEntitySignal.set(this.#draftEntity);
+                this.draftFormData.set(entityToFormData(this.#draftEntity, this.#dialogData.formFields));
+            }
+        }
+    }
+    selectTab(key) {
+        const targetTab = this.tabs().find(t => t.key === key);
+        if (this.isCreateMode() && targetTab?.type === 'table') {
+            const fields = this.formFieldsValue;
+            const data = this.draftFormData();
+            const fixed = this.#dialogData?.fixedFormData;
+            const merged = fixed ? { ...data, ...fixed } : data;
+            const result = validateForm(fields, merged);
+            if (!result.valid) {
+                this.validationErrors.emit(result);
+                return;
+            }
+            this.#syncDraftEntity();
+        }
+        this.activeTabKey.set(key);
+    }
+    onFormDataChanged(data) {
+        this.draftFormData.set(data);
+    }
+    onFormSubmitted(data) {
+        this.formSubmitted.emit(data);
+    }
+    onFormCancelled() {
+        this.#cleanupDraftEntity();
+        this.formCancelled.emit();
+        this.#dialogRef?.close();
+    }
+    onFieldChanged(event) {
+        if (this.isCreateMode()) {
+            this.draftFormData.update(d => ({ ...d, [event.field]: event.value }));
+        }
+        this.fieldChanged.emit(event);
+    }
+    onValidationErrors(result) {
+        this.validationErrors.emit(result);
+    }
+    /** 外部保存按钮（create 模式） */
+    onSave() {
+        const fields = this.formFieldsValue;
+        const data = this.draftFormData();
+        const fixed = this.#dialogData?.fixedFormData;
+        const merged = fixed ? { ...data, ...fixed } : data;
+        const result = validateForm(fields, merged);
+        if (!result.valid) {
+            this.validationErrors.emit(result);
+            return;
+        }
+        if (this.#draftEntity) {
+            this.#syncDraftEntity();
+            this.#draftEntity
+                .save()
+                .then(() => {
+                this.#draftEntity = null;
+                this.draftEntitySignal.set(null);
+                this.#dialogRef?.close('saved');
+            })
+                .catch(e => this.#errorHandler.handleError(e));
+        }
+        else {
+            this.formSubmitted.emit(merged);
+            this.#dialogRef?.close();
+        }
+    }
+    onCancel() {
+        this.onFormCancelled();
+    }
+    buildFixedQuery(tab) {
+        const entityId = this.#draftEntity?.id ?? this.formDataValue['id'];
+        if (!entityId)
+            return undefined;
+        if (tab.relationKind === RelationKind.ONE_TO_MANY && tab.foreignKeyField) {
+            return { combinator: 'and', rules: [{ field: tab.foreignKeyField, operator: '=', value: entityId }] };
+        }
+        if (tab.relationKind === RelationKind.MANY_TO_MANY && tab.mappedProperty) {
+            return { combinator: 'and', rules: [{ field: `${tab.mappedProperty}.id`, operator: '=', value: entityId }] };
+        }
+        return undefined;
+    }
+    buildFixedFormData(tab) {
+        const entityId = this.#draftEntity?.id ?? this.formDataValue['id'];
+        if (!entityId)
+            return undefined;
+        if (tab.relationKind === RelationKind.ONE_TO_MANY && tab.foreignKeyField) {
+            return { [tab.foreignKeyField]: entityId };
+        }
+        return undefined;
+    }
+    /** 将表单数据同步到草稿实体 */
+    #syncDraftEntity() {
+        if (!this.#draftEntity)
+            return;
+        const data = this.draftFormData();
+        const fixed = this.#dialogData?.fixedFormData;
+        const merged = fixed ? { ...data, ...fixed } : data;
+        Object.assign(this.#draftEntity, merged);
+    }
+    /** 清理草稿实体缓存 */
+    #cleanupDraftEntity() {
+        if (!this.#draftEntity || !this.#rxdb)
+            return;
+        this.#rxdb.entityManager.removeEntityCache(this.#draftEntity);
+        this.#draftEntity = null;
+        this.draftEntitySignal.set(null);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: EntityDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: EntityDetailComponent, isStandalone: true, selector: "rxdb-entity-detail", inputs: { namespace: { classPropertyName: "namespace", publicName: "namespace", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, entityId: { classPropertyName: "entityId", publicName: "entityId", isSignal: true, isRequired: false, transformFunction: null }, metadata: { classPropertyName: "metadata", publicName: "metadata", isSignal: true, isRequired: false, transformFunction: null }, formFields: { classPropertyName: "formFields", publicName: "formFields", isSignal: true, isRequired: false, transformFunction: null }, formData: { classPropertyName: "formData", publicName: "formData", isSignal: true, isRequired: false, transformFunction: null }, formMode: { classPropertyName: "formMode", publicName: "formMode", isSignal: true, isRequired: false, transformFunction: null }, relatedEntityProvider: { classPropertyName: "relatedEntityProvider", publicName: "relatedEntityProvider", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { formSubmitted: "formSubmitted", formCancelled: "formCancelled", fieldChanged: "fieldChanged", validationErrors: "validationErrors" }, ngImport: i0, template: "<rxdb-entity-dialog [title]=\"dialogTitle()\" (closeRequested)=\"onCancel()\">\n  <!-- Tab Bar -->\n  <div class=\"tabs tabs-border flex-1\" role=\"tablist\">\n    @for (tab of tabs(); track tab.key) {\n      <input\n        class=\"tab\"\n        [attr.aria-label]=\"tab.label\"\n        [checked]=\"tab.key === activeTabKey()\"\n        [name]=\"tabGroupName\"\n        (change)=\"selectTab(tab.key)\"\n        role=\"tab\"\n        type=\"radio\"\n      />\n      <div\n        class=\"tab-content border-base-300 bg-base-100\"\n        [class.overflow-auto]=\"tab.type === 'form'\"\n        [class.overflow-hidden]=\"tab.type === 'table'\"\n        [class.p-4]=\"tab.type === 'form'\"\n        [hidden]=\"tab.key !== activeTabKey()\"\n      >\n        @if (tab.type === 'form') {\n          <rxdb-entity-form\n            [data]=\"formDataValue\"\n            [fields]=\"formFieldsValue\"\n            [mode]=\"formModeValue\"\n            [relatedEntityProvider]=\"relatedEntityProviderValue\"\n            [showActions]=\"!isCreateMode()\"\n            (fieldChanged)=\"onFieldChanged($event)\"\n            (formCancelled)=\"onFormCancelled()\"\n            (formSubmitted)=\"onFormSubmitted($event)\"\n            (validationErrors)=\"onValidationErrors($event)\"\n          />\n        }\n        @if (tab.type === 'table') {\n          <rxdb-entity-list\n            [creationChain]=\"creationChain()\"\n            [draftParentEntity]=\"draftEntitySignal()\"\n            [fixedFormData]=\"buildFixedFormData($any(tab))\"\n            [fixedQuery]=\"buildFixedQuery($any(tab))\"\n            [name]=\"$any(tab).relatedEntityName\"\n            [namespace]=\"$any(tab).relatedNamespace\"\n            [parentEntity]=\"parentEntityForRelation()\"\n            [parentRelationName]=\"$any(tab).relationName\"\n            [relationKind]=\"$any(tab).relationKind\"\n          />\n        }\n      </div>\n    }\n  </div>\n\n  <!-- Save/Cancel buttons for create mode (below tabs) -->\n  @if (isCreateMode()) {\n    <div class=\"border-base-300 flex shrink-0 justify-end gap-2 border-t px-4 py-3\">\n      <button class=\"btn\" (click)=\"onCancel()\" type=\"button\">\u53D6\u6D88</button>\n      <button class=\"btn btn-primary\" (click)=\"onSave()\" type=\"button\">\u4FDD\u5B58</button>\n    </div>\n  }\n</rxdb-entity-dialog>\n", styles: [":host{display:flex;flex-direction:column;height:100%;overflow:hidden}.tabs{grid-template-rows:auto 1fr!important}.tab-content{display:flex!important;flex-direction:column}\n"], dependencies: [{ kind: "component", type: EntityFormComponent, selector: "rxdb-entity-form", inputs: ["fields", "data", "mode", "relatedEntityProvider", "showActions"], outputs: ["fieldChanged", "formSubmitted", "formCancelled", "validationErrors"] }, { kind: "component", type: EntityListComponent, selector: "rxdb-entity-list", inputs: ["namespace", "name", "fixedQuery", "fixedFormData", "draftParentEntity", "parentRelationName", "creationChain", "relationKind", "parentEntity", "mode", "alreadyLinkedIds"], outputs: ["viewEntity", "selectionConfirmed", "selectionCancelled"] }, { kind: "component", type: EntityDialogComponent, selector: "rxdb-entity-dialog", inputs: ["title"], outputs: ["closeRequested"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: EntityDetailComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rxdb-entity-detail', imports: [EntityFormComponent, EntityListComponent, EntityDialogComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<rxdb-entity-dialog [title]=\"dialogTitle()\" (closeRequested)=\"onCancel()\">\n  <!-- Tab Bar -->\n  <div class=\"tabs tabs-border flex-1\" role=\"tablist\">\n    @for (tab of tabs(); track tab.key) {\n      <input\n        class=\"tab\"\n        [attr.aria-label]=\"tab.label\"\n        [checked]=\"tab.key === activeTabKey()\"\n        [name]=\"tabGroupName\"\n        (change)=\"selectTab(tab.key)\"\n        role=\"tab\"\n        type=\"radio\"\n      />\n      <div\n        class=\"tab-content border-base-300 bg-base-100\"\n        [class.overflow-auto]=\"tab.type === 'form'\"\n        [class.overflow-hidden]=\"tab.type === 'table'\"\n        [class.p-4]=\"tab.type === 'form'\"\n        [hidden]=\"tab.key !== activeTabKey()\"\n      >\n        @if (tab.type === 'form') {\n          <rxdb-entity-form\n            [data]=\"formDataValue\"\n            [fields]=\"formFieldsValue\"\n            [mode]=\"formModeValue\"\n            [relatedEntityProvider]=\"relatedEntityProviderValue\"\n            [showActions]=\"!isCreateMode()\"\n            (fieldChanged)=\"onFieldChanged($event)\"\n            (formCancelled)=\"onFormCancelled()\"\n            (formSubmitted)=\"onFormSubmitted($event)\"\n            (validationErrors)=\"onValidationErrors($event)\"\n          />\n        }\n        @if (tab.type === 'table') {\n          <rxdb-entity-list\n            [creationChain]=\"creationChain()\"\n            [draftParentEntity]=\"draftEntitySignal()\"\n            [fixedFormData]=\"buildFixedFormData($any(tab))\"\n            [fixedQuery]=\"buildFixedQuery($any(tab))\"\n            [name]=\"$any(tab).relatedEntityName\"\n            [namespace]=\"$any(tab).relatedNamespace\"\n            [parentEntity]=\"parentEntityForRelation()\"\n            [parentRelationName]=\"$any(tab).relationName\"\n            [relationKind]=\"$any(tab).relationKind\"\n          />\n        }\n      </div>\n    }\n  </div>\n\n  <!-- Save/Cancel buttons for create mode (below tabs) -->\n  @if (isCreateMode()) {\n    <div class=\"border-base-300 flex shrink-0 justify-end gap-2 border-t px-4 py-3\">\n      <button class=\"btn\" (click)=\"onCancel()\" type=\"button\">\u53D6\u6D88</button>\n      <button class=\"btn btn-primary\" (click)=\"onSave()\" type=\"button\">\u4FDD\u5B58</button>\n    </div>\n  }\n</rxdb-entity-dialog>\n", styles: [":host{display:flex;flex-direction:column;height:100%;overflow:hidden}.tabs{grid-template-rows:auto 1fr!important}.tab-content{display:flex!important;flex-direction:column}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { namespace: [{ type: i0.Input, args: [{ isSignal: true, alias: "namespace", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], entityId: [{ type: i0.Input, args: [{ isSignal: true, alias: "entityId", required: false }] }], metadata: [{ type: i0.Input, args: [{ isSignal: true, alias: "metadata", required: false }] }], formFields: [{ type: i0.Input, args: [{ isSignal: true, alias: "formFields", required: false }] }], formData: [{ type: i0.Input, args: [{ isSignal: true, alias: "formData", required: false }] }], formMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "formMode", required: false }] }], relatedEntityProvider: [{ type: i0.Input, args: [{ isSignal: true, alias: "relatedEntityProvider", required: false }] }], formSubmitted: [{ type: i0.Output, args: ["formSubmitted"] }], formCancelled: [{ type: i0.Output, args: ["formCancelled"] }], fieldChanged: [{ type: i0.Output, args: ["fieldChanged"] }], validationErrors: [{ type: i0.Output, args: ["validationErrors"] }] } });
+
+var entityDetail = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    EntityDetailComponent: EntityDetailComponent
+});
+
+/**
+ * @aiao/rxdb-model-angular
+ *
+ * RxDB 模型 Angular 组件库。
+ * VTable 基础设施请从 `@aiao/rxdb-model` 导入。
+ */
+// Angular 配置
+
+/**
+ * 子查询构建器组件
+ *
+ * @description
+ * 用于 EXISTS/NOT EXISTS 操作符的嵌套查询条件。
+ * 支持：
+ * - 添加子条件
+ * - 嵌套规则组
+ * - 清空子条件
+ */
+class SubqueryBuilderComponent {
+    service;
+    /** initialQuery 是否已应用（只应用一次） */
+    initialQueryApplied = false;
+    /** 根规则组 Signal */
+    rootGroupSignal;
+    /** 验证 Signal */
+    validationSignal;
+    /** 字段列表 */
+    fields = input.required(...(ngDevMode ? [{ debugName: "fields" }] : /* istanbul ignore next */ []));
+    /** 初始查询 */
+    initialQuery = input(...(ngDevMode ? [undefined, { debugName: "initialQuery" }] : /* istanbul ignore next */ []));
+    /** 最大嵌套层级 */
+    maxDepth = input(3, ...(ngDevMode ? [{ debugName: "maxDepth" }] : /* istanbul ignore next */ []));
+    /** 查询变更事件 */
+    queryChange = output();
+    /** 验证变更事件 */
+    validationChange = output();
+    /** 根规则组 */
+    rootGroup = computed(() => {
+        return this.rootGroupSignal();
+    }, ...(ngDevMode ? [{ debugName: "rootGroup" }] : /* istanbul ignore next */ []));
+    /** 是否有规则 */
+    hasRules = computed(() => {
+        const group = this.rootGroup();
+        return group && group.rules.length > 0;
+    }, ...(ngDevMode ? [{ debugName: "hasRules" }] : /* istanbul ignore next */ []));
+    constructor() {
+        // 在构造函数中初始化服务
+        this.service = createQueryBuilderService({
+            config: {
+                maxNestingLevel: this.maxDepth()
+            }
+        });
+        // 转换 Observable 为 Signal
+        this.rootGroupSignal = toSignal(this.service.rootGroup$, { requireSync: true });
+        this.validationSignal = toSignal(this.service.validation$, { initialValue: undefined });
+        // 监听字段变化并同步到服务
+        effect(() => {
+            const fields = this.fields();
+            if (fields.length > 0) {
+                this.service.setFields(fields);
+            }
+        });
+        // 监听初始查询并加载（只应用一次，避免用户修改后被重置）
+        effect(() => {
+            if (!this.initialQueryApplied) {
+                const initial = this.initialQuery();
+                if (initial) {
+                    this.initialQueryApplied = true;
+                    this.service.fromRxDBQuery(initial);
+                }
+            }
+        });
+        // 监听查询变化并发出事件
+        effect(() => {
+            const group = this.rootGroup();
+            if (group) {
+                const query = this.service.toRxDBQuery();
+                // 如果没有规则，返回 undefined 而不是空的 RuleGroup
+                if (!query.rules || query.rules.length === 0) {
+                    this.queryChange.emit(undefined);
+                }
+                else {
+                    this.queryChange.emit(query);
+                }
+            }
+        });
+        // 监听验证变化并发出事件
+        effect(() => {
+            const validation = this.validationSignal();
+            if (validation) {
+                this.validationChange.emit(validation);
+            }
+        });
+        // 同步 maxDepth 到 service
+        effect(() => {
+            this.service.setMaxNestingLevel(this.maxDepth());
+        });
+    }
+    /** 销毁服务 */
+    ngOnDestroy() {
+        this.service.destroy();
+    }
+    /** 添加第一条规则 */
+    handleAddFirstRule() {
+        const firstField = this.fields()[0];
+        if (firstField) {
+            this.service.addRule(undefined, {
+                field: firstField.name,
+                operator: firstField.isRelation ? 'exists'
+                    : firstField.type === 'keyValue' ? 'null'
+                        : '=',
+                value: firstField.type === 'boolean' ? false : ''
+            });
+        }
+    }
+    /** 清空所有规则 */
+    handleClear() {
+        this.service.clear();
+    }
+    /** 添加规则到指定组 */
+    onAddRule(event) {
+        this.service.addRule(event.parentId, event.rule);
+    }
+    /** 添加子组到指定组 */
+    onAddGroup(parentId) {
+        this.service.addGroup(parentId);
+    }
+    /** 删除规则或组 */
+    onRemoveItem(id) {
+        this.service.remove(id);
+    }
+    /** 更新规则 */
+    onUpdateRule(event) {
+        this.service.updateRule(event.id, event.updates);
+    }
+    /** 更新组合器 */
+    onUpdateCombinator(event) {
+        this.service.updateGroupCombinator(event.id, event.combinator);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: SubqueryBuilderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: SubqueryBuilderComponent, isStandalone: true, selector: "rxdb-subquery-builder", inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null }, initialQuery: { classPropertyName: "initialQuery", publicName: "initialQuery", isSignal: true, isRequired: false, transformFunction: null }, maxDepth: { classPropertyName: "maxDepth", publicName: "maxDepth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { queryChange: "queryChange", validationChange: "validationChange" }, ngImport: i0, template: `
+    <div class="subquery-builder border-base-300 bg-base-200/50 p-2">
+      @if (!hasRules()) {
+        <div class="text-base-content/60 flex items-center gap-2">
+          <button class="btn btn-ghost btn-xs" (click)="handleAddFirstRule()" type="button">+ 添加子条件</button>
+          <span class="text-xs opacity-50">（可选）</span>
+        </div>
+      } @else {
+        <rxdb-query-group
+          [depth]="0"
+          [fields]="fields()"
+          [group]="rootGroup()!"
+          [maxDepth]="maxDepth()"
+          (addGroup)="onAddGroup($event)"
+          (addRule)="onAddRule($event)"
+          (removeItem)="onRemoveItem($event)"
+          (updateCombinator)="onUpdateCombinator($event)"
+          (updateRule)="onUpdateRule($event)"
+        />
+        <div class="mt-2 flex justify-end">
+          <button class="btn btn-ghost btn-xs text-error" (click)="handleClear()" type="button">清空</button>
+        </div>
+      }
+    </div>
+  `, isInline: true, styles: ["rxdb-query-group ::ng-deep>.rxdb-query-group{border:0;padding:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: QueryGroupComponent, selector: "rxdb-query-group", inputs: ["group", "fields", "errors", "depth", "maxDepth", "dragDropHandler", "allowCollapse"], outputs: ["addRule", "addGroup", "removeItem", "updateRule", "updateCombinator"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: SubqueryBuilderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rxdb-subquery-builder', standalone: true, imports: [CommonModule, QueryGroupComponent], template: `
+    <div class="subquery-builder border-base-300 bg-base-200/50 p-2">
+      @if (!hasRules()) {
+        <div class="text-base-content/60 flex items-center gap-2">
+          <button class="btn btn-ghost btn-xs" (click)="handleAddFirstRule()" type="button">+ 添加子条件</button>
+          <span class="text-xs opacity-50">（可选）</span>
+        </div>
+      } @else {
+        <rxdb-query-group
+          [depth]="0"
+          [fields]="fields()"
+          [group]="rootGroup()!"
+          [maxDepth]="maxDepth()"
+          (addGroup)="onAddGroup($event)"
+          (addRule)="onAddRule($event)"
+          (removeItem)="onRemoveItem($event)"
+          (updateCombinator)="onUpdateCombinator($event)"
+          (updateRule)="onUpdateRule($event)"
+        />
+        <div class="mt-2 flex justify-end">
+          <button class="btn btn-ghost btn-xs text-error" (click)="handleClear()" type="button">清空</button>
+        </div>
+      }
+    </div>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["rxdb-query-group ::ng-deep>.rxdb-query-group{border:0;padding:0}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { fields: [{ type: i0.Input, args: [{ isSignal: true, alias: "fields", required: true }] }], initialQuery: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialQuery", required: false }] }], maxDepth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxDepth", required: false }] }], queryChange: [{ type: i0.Output, args: ["queryChange"] }], validationChange: [{ type: i0.Output, args: ["validationChange"] }] } });
+
+var subqueryBuilder_component = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    SubqueryBuilderComponent: SubqueryBuilderComponent
+});
+
+/**
+ * @aiao/rxdb-model-angular
+ *
+ * Angular 查询构建器组件库
+ *
+ * @description
+ * 提供可视化的 RxDB 查询条件构建组件，支持：
+ * - 从 EntityMetadata 自动解析字段
+ * - 支持多种数据类型和操作符
+ * - AND/OR 条件组合
+ * - 最大 5 层嵌套
+ * - 实时验证
+ *
+ * @example
+ * ```typescript
+ * import { QueryBuilderComponent } from '@aiao/rxdb-model-angular';
+ *
+ * @Component({
+ *   imports: [QueryBuilderComponent],
+ *   template: `
+ *     <rxdb-query-builder
+ *       [entity]="userEntity"
+ *       (queryChange)="onQueryChange($event)"
+ *     />
+ *   `
+ * })
+ * export class MyComponent {
+ *   userEntity = inject(UserEntity);
+ *
+ *   onQueryChange(query: RuleGroup<User>) {
+ *     console.log('Query changed:', query);
+ *   }
+ * }
+ * ```
+ */
+// 主组件
+
+// Entity Detail Angular
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { DEFAULT_QUERY_BUILDER_THEME, ENTITY_TABLE_CONFIG, EntityDetailComponent, EntityDialogComponent, EntityFormComponent, EntityListComponent, EntityTableComponent, FieldSelectorComponent, OperatorSelectorComponent, PopoverSelectComponent, QUERY_BUILDER_THEME, QueryBuilderComponent, QueryGroupComponent, QueryRuleComponent, QueryTableComponent, SubqueryBuilderComponent, TreeItemDirective, TreeSelectComponent, ValueInputComponent, provideQueryBuilderTheme };
+//# sourceMappingURL=aiao-rxdb-model-angular.mjs.map